Aurigma Image Uploader 5.0 Dual
Upgrading from Image Uploader 1.x for ActiveX Step by Step

Aurigma Image Uploader 1.0 for ActiveX and Aurigma Image Uploader Dual are not backward compatible. Not only new properties, methods, and POST fields are added, but also some of them are renamed, and the behavior is changed. Also, to work with Aurigma Image Uploader Dual it is necessary to use a special helper JavaScript called iuembed.js instead of OBJECT element. The full list of changes can be found in the API and Behaviour Changes from Image Uploader 1.x for ActiveX topic.

To migrate to version 3.x you should make changes both in client-side and server-side code. This topic demonstrates an example of such changes.

# Changes in Client-Side Code

- First of all, we need to use iuembed.js instead of the OBJECT element as described in the API and Behaviour Changes from Image Uploader 1.x for ActiveX topic.
- If Image Uploader has been used by your users for quite a long time, you may desire to have it looking similar to the old version. This is important for those users, who have little experience in computers, and for whom adaptation to a new interface can be problematic. Aurigma Image Uploader Dual supports several layouts. The layout that is closest to the one which was available in version 1.x is the two panes layout. Set it using the PaneLayout property.
- Aurigma Image Uploader 1.0 for ActiveX could resize original images. If this feature was activated there was no way to get the original file. More over, all files were converted to JPEG format, so in these cases the behavior could be unexpected. That's why the behavior has been changed. Now the source file is uploaded as-is, without any changes (neither resized, rotated, or recompressed). Instead, you can upload any number of modified copies (called thumbnails). So to keep an old behavior (i.e. not to have original file and upload small thumbnail and image resized for web) you need:
  - Disable the upload of the source file using the UploadSourceFile property.
  - Configure additional thumbnails by specifying an appropriate fit mode in UploadThumbnail1FitMode, UploadThumbnail2FitMode, etc.

  See the Resizing and Rotating Images topic for more information about this.

- Aurigma Image Uploader 1.0 for ActiveX had the SourceImageSize property that was used to specify dimensions of the thumbnail (the size in pixels of a bounding square). Now the bounding rectangle can be specified for each uploaded thumbnail using such properties as UploadThumbnail1Width and UploadThumbnail1Height, etc (change the thumbnail number to set the width/height for the second, third, and others thumbnails).

  Fit mode is also specified for each thumbnail: UploadThumbnail1FitMode, UploadThumbnail2FitMode, etc. instead of the SourceImageFitMode property.

- To change JPEG quality of thumbnails, use UploadThumbnail1JpegQuality, UploadThumbnail2JpegQuality, etc. instead of JPEGQuality.
- As the license key for Aurigma Image Uploader 1.0 for ActiveX is not valid for Aurigma Image Uploader Dual, you will need to update the LicenseKey property.
- In new Image Uploader, the OnProgress event was renamed to Progress.

  Aurigma Image Uploader 1.0 for ActiveX

  HTML | Copy Code
  --- | ---
        1:  <html>
        2:  <head>
        3:      <title>Aurigma Image Uploader</title>
        4:  </head>
        5:  <body>
        6:      <form ID="Form1" name="Form1">
        7:          Author: <input type="text" name="Author" id="Author" value="Alex" size="50">
        8:      </form>
        9:
       10:      <object type="application/x-oleobject" width="710" height="500"
       11:          id="ImageUploader" name="ImageUploader"
       12:
       13:          classid="clsid:BB6633E1-FE3B-41A1-A2D3-D08400D828BC"
       14:          CodeBase="ImageUploader.CAB" VIEWASTEXT>
       15:
       16:
       17:
       18:          <param name="SourceImageFitMode" value="fit">
       19:          <param name="SourceImageSize" value="640">
       20:
       21:
       22:
       23:          <param name="UploadThumbnailFitMode" value="fit">
       24:          <param name="UploadThumbnailSize" value="120">
       25:
       26:          <param name="JPEGQuality" value="60">
       27:
       28:          <param name="ShowDebugWindow" value="True">
       29:          <param name="AdditionalFormName" value="Form1">
       30:
       31:          <param name="Action" value="upload.asp">
       32:
       33:          <param name="LicenseKey" value="6221-7840-6351-7041">
       34:
       35:      </object>
       36:      <script for="ImageUploader" event="OnProgress(Status, Progress, ValueMax, Value, StatusText)">
       37:
       38:  if (Status=="COMPLETE"){
       39:      // When upload is finished, we redirect to the galery.aspx page
       40:      window.location = "gallery.asp";
       41:  }
       42:      </script>
       43:
       44:
       45:
       46:  </body>
       47:  </html>

  New Aurigma Image Uploader Dual

  JavaScript | Copy Code
  --- | ---
        1:  <html>
        2:  <head>
        3:      <title>Aurigma Image Uploader</title>
        4:  </head>
        5:  <body>
        6:      <form ID="Form1" name="Form1">
        7:          Author: <input type="text" name="Author" id="Author" value="Alex" size="50">
        8:      </form>
        9:
       10:      <script type="text/javascript" src="iuembed.js"></script>
       11:
       12:      <script type="text/javascript">
       13:  var iu = new ImageUploaderWriter("ImageUploader", 710, 500);
       14:
       15:  iu.addParam("Layout", "TwoPanes");
       16:
       17:  iu.addParam("UploadSourceFile", "false");
       18:  iu.addParam("UploadThumbnail1FitMode", "Fit");
       19:  iu.addParam("UploadThumbnail1Width", "640");
       20:  iu.addParam("UploadThumbnail1Height", "640");
       21:  iu.addParam("UploadThumbnail1JpegQuality", "60");
       22:
       23:  iu.addParam("UploadThumbnail2FitMode", "Fit");
       24:  iu.addParam("UploadThumbnail2Width", "120");
       25:  iu.addParam("UploadThumbnail2Height", "120");
       26:  iu.addParam("UploadThumbnail2JpegQuality", "60");
       27:
       28:  iu.addParam("ShowDebugWindow", "true");
       29:  iu.addParam("AdditionalFormName", "Form1");
       30:
       31:  iu.addParam("Action", "upload.asp");
       32:
       33:  iu.addParam("LicenseKey", "5261-7540-6011-6012");
       34:
       35:
       36:  iu.addEventListener("Progress", "ImageUploader_Progress");
       37:  function ImageUploader_Progress(Status, Progress, ValueMax, Value, StatusText){
       38:      if (Status=="COMPLETE"){
       39:          // When upload is finished, we redirect to the galery.aspx page
       40:          window.location.replace('PictureGallery.asp');
       41:      }
       42:  }
       43:
       44:  iu.writeHtml();
       45:      </script>
       46:  </body>
       47:  </html>

  # Changes in Server-Side Code

  The server-side code should be also modified, but fortunately the number of changes you will have to make is much less than for the client side. The following changes should be made:

  - The ImageCount form field was renamed to FileCount, so you need to reflect it in the code.
  - As we do not send the source image and send thumbnails instead, we need to replace ImageN to Thumbnail1_N (if we use UploadThumbnail1XXX properties to upload a resized copy of the original file).
  - We should also replace ThumbnailN field with a corresponding one (e.g. Thumbnail2_N if we use UploadThumbnail2XXX for the thumbnail).

Aurigma Image Uploader 1.0 for ActiveX

ASP.NET | Copy Code
--- | ---
      1:  <%
      2:  Dim strGalleryPath
      3:  strGalleryPath = "Gallery/"
      4:
      5:
      6:  'We create aspSmartUpload object for uploading images
      7:  Dim objUpload
      8:  Set objUpload = Server.CreateObject("aspSmartUpload.SmartUpload")
      9:
     10:  objUpload.Upload
     11:
     12:  'Total amount of uploaded files
     13:  Dim intFileCount
     14:  intFileCount = objUpload.Form("ImageCount").Values
     15:
     16:
     17:  Dim I
     18:
     19:  'We run over uploaded images and load it
     20:  For I=1 To intFileCount
     21:
     22:      'Fetch source images and save it to disk
     23:      Set objFile = objUpload.Files("Image" & I)
     24:
     25:      objFile.SaveAs (Server.MapPath("Gallery/" & I & ".jpg"))
     26:      'Fetch thumbnails and save it to disk
     27:
     28:      Set objFile = objUpload.Files("Thumbnail" & I)
     29:      objFile.SaveAs (Server.MapPath("Gallery/Thumbnails/" & I & ".jpg"))
     30:
     31:  Next
     32:  %>

New Aurigma Image Uploader Dual

ASP.NET | Copy Code
--- | ---
      1:  <%
      2:  Dim strGalleryPath
      3:  strGalleryPath = "Gallery/"
      4:
      5:
      6:  'We create aspSmartUpload object for uploading images
      7:  Dim objUpload
      8:  Set objUpload = Server.CreateObject("aspSmartUpload.SmartUpload")
      9:
     10:  objUpload.Upload
     11:
     12:  'Total amount of uploaded files
     13:  Dim intFileCount
     14:  intFileCount = objUpload.Form("FileCount").Values
     15:
     16:
     17:  Dim I
     18:
     19:  'We run over uploaded images and load it
     20:  For I=1 To intFileCount
     21:
     22:      'Fetch source images and save it to disk
     23:      Set objFile = objUpload.Files("Thumbnail1_" & I)
     24:
     25:      objFile.SaveAs (Server.MapPath("Gallery/" & I & ".jpg"))
     26:      'Fetch thumbnails and save it to disk
     27:
     28:      Set objFile = objUpload.Files("Thumbnail2_" & I)
     29:      objFile.SaveAs (Server.MapPath("Gallery/Thumbnails/" & I & ".jpg"))
     30:
     31:  Next
     32:  %>