Welcome Guest! You need to login or register to make posts.

Notification

Icon
Error

Options
Go to last post Go to first unread
Fedor  
#1 Posted : Monday, April 5, 2004 6:00:00 AM(UTC)
Fedor

Rank: Advanced Member

Groups: Member, Administration, Moderator
Joined: 7/28/2003(UTC)
Posts: 1,558

Thanks: 5 times
Was thanked: 62 time(s) in 61 post(s)
Image Uploader 1.x and 3.x are not backward compatible. We had not only to add new propepties and methods to Image Uploader, but also rename some functions and fields, and change the behaviour of some methods to make the API more clear and intuitive. The full list of changes can be found in the Upgrading from Image Uploader 1.x topic of image Uploader documentation.

Note: 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 should change the attributes of the <object> tag, namely classid (to specify what object to create) and codebase (to specify where to download the control from if one is not installed on the client).
  • If Image Uploader has been used by your users for quite a long time, you may desire to have it looking close to the old version. This is important for users who have little experience in computers, where adaptation to a new interface can be problematic. Image Uploader 3.x supports several layouts. The layout that is closest to the one which was available in version 1.x is two panes layout. Set it using the Layout property.
  • Image Uploader 1.x could resize original images. If this feature was activated there was no way to get the original file. More over, all files were converting to JPEG format, so in these cases the behaviour could be unexpected. That's why we decided to change the behaviour. Now the source is uploaded as-is without any changes (neither resized, rotated, or recompressed). Instead, you can upload up to three modified copies (called thumbnails). So if you need to have old behaviour (i.e. do not have original file and upload small thumbnail and image resized for web) you need to disable source file uploading (using the UploadSourceFile property) and upload an additional thumbnail (e.g. by specifying another value than "off" in the UploadThumbnail2FitMode property).
  • In the old version of Image Uploader, the SourceImageSize property was used to specify dimensions of the thumbnail (it specified the size of a bounding square). Now the bounding rectangle can be specified for each uploaded thumbnail, like this: UploadThumbnail1Width and UploadThumbnail1Height (just change the thumbnail number to set the width/height for the second or third thumbnail). Fit mode for each thumbnail now is specified with UploadThumbnail1FitMode, UploadThumbnail2FitMode, and UploadThumbnail3FitMode instead of SourceImageFitMode property.
  • To change JPEG quality of the thumbnails property JPEGQuality was used in Image Uploader 1.x. Now each thumbnail quality is specified individually, using UploadThumbnail1JpegQuality, UploadThumbnail2JpegQuality, and UploadThumbnail3JpegQuality properties accordingly.
  • As the license key for Image Uploader 1.x is not valid for new Image Uploader, you will need to update a LicenseKey property.
  • In new Image Uploader OnProgress event was renamed to Progress.
Image Uploader 1.x

Code:
<html>
  <head>
    <title>Aurigma Image Uploader</title>
  </head>
  <body>
    <table cellpadding="0" cellspacing="0" border="0" width="710">

      <tr>
        <td align="left" width="710">
          <form ID="Form1" name="Form1">

            Author: <input type="text" name="Author" id="Author" value="Alex" size="50">

          </form>
        </td>
      </tr>
      <tr>
        <td width="710">

          <object type="application/x-oleobject" width="710" height="500" 
            id="ImageUploader" name="ImageUploader"

            classid="clsid:BB6633E1-FE3B-41A1-A2D3-D08400D828BC" 
            CodeBase="ImageUploader.CAB">

          


            <param name="SourceImageFitMode" value="fit">

            <param name="SourceImageSize" value="640">
            


            
            <param name="UploadThumbnailFitMode" value="fit">

            <param name="UploadThumbnailSize" value="120">
            
            <param name="JPEGQuality" value="90">

            <param name="ShowDebugWindow" value="True">
            <param name="AdditionalFormName" value="Form1">

            <param name="Action" value="Upload.asp">

            <param name="LicenseKey" value="6221-7840-6351-7041">

          </object>
        </td>
      </tr>
    </table>
<script for="ImageUploader" event="OnProgress(Status, Progress, ValueMax, Value, StatusText)">

if (Status=="COMPLETE"){
  // When upload is finished, we are redirecting to the PictureGalery.aspx page
  window.location.replace('PictureGallery.asp');

}
</script>
  </body>
</html>


New Image Uploader

Code:
<html>
  <head>
    <title>Aurigma Image Uploader</title>
  </head>
  <body>

    <table cellpadding="0" cellspacing="0" border="0" width="710">

      <tr>
        <td align="left" width="710">
          <form ID="Form1" name="Form1">

            Author: <input type="text" name="Author" id="Author" value="Alex" size="50">

          </form>
        </td>
      </tr>      
      <tr>
        <td width="710">

          <object type="application/x-oleobject" width="710" height="500" 
            id="ImageUploader" name="ImageUploader"

            classid="clsid:A18962F6-E6ED-40B1-97C9-1FB36F38BFA8" 
            CodeBase="ImageUploader3.cab">

            <param name="Layout" value="TwoPanes">


            <param name="UploadSourceFile" value="False">
            <param name="UploadThumbnail1FitMode" value="fit">

            <param name="UploadThumbnail1Width" value="640">
            <param name="UploadThumbnail1Height" value="640">            
            <param name="UploadThumbnail1JpegQuality" value="60">

            <param name="UploadThumbnail2FitMode" value="fit">
            <param name="UploadThumbnail2Width" value="120">

            <param name="UploadThumbnail2Height" value="120">
            <param name="UploadThumbnail2JpegQuality" value="60">

            <param name="ShowDebugWindow" value="True">
            <param name="AdditionalFormName" value="Form1">

            <param name="Action" value="Upload.asp">

            <param name="LicenseKey" value="5261-7540-6011-6012">

          </object>          
        </td>
      </tr>
    </table>
<script for="ImageUploader" event="Progress(Status, Progress, ValueMax, Value, StatusText)">

if (Status=="COMPLETE"){
  // When upload is finished, we are redirecting to the PictureGalery.aspx page
  window.location.replace('PictureGallery.asp');

}
</script>    
  </body>
</html>


Changes in Server-Side Code

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

[list]
  • The form field ImageCount was renamed to FileCount, so we 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 resized original file).
  • We should also replace field ThumbnailN with appropriate one (e.g. Thumbnail2_N if we use UploadThumbnail2XXX for the thumbnail).

    Code:
    <%
    Dim strGalleryPath
    strGalleryPath = "Gallery/"
    
    
    'We create aspSmartUpload object for uploading images        
    Dim objUpload
    Set objUpload = Server.CreateObject("aspSmartUpload.SmartUpload")
    
    objUpload.Upload
    
    'Total amount of uploaded files
    Dim intFileCount
    intFileCount = objUpload.Form("ImageCount").Values
    
    
    Dim I
    
    'We run over uploaded images and load it
    For I=1 To intFileCount
    
        'Fetch source images and save it to disk
        Set objFile = objUpload.Files("Image" & I)
    
        objFile.SaveAs (Server.MapPath("Gallery/" & I & ".jpg"))
        'Fetch thumbnails and save it to disk
    
        Set objFile = objUpload.Files("Thumbnail" & I)
        objFile.SaveAs (Server.MapPath("Gallery/Thumbnails/" & I & ".jpg"))
    
    Next
    %>


    New Image Uploader
    Code:
    <%
    Dim strGalleryPath
    strGalleryPath = "Gallery/"
    
    
    'We create aspSmartUpload object for uploading images        
    Dim objUpload
    Set objUpload = Server.CreateObject("aspSmartUpload.SmartUpload")
    
    objUpload.Upload
    
    'Total amount of uploaded files
    Dim intFileCount
    intFileCount = objUpload.Form("FileCount").Values
    
    
    Dim I
    
    'We run over uploaded images and load it
    For I=1 To intFileCount
    
        'Fetch source images and save it to disk
        Set objFile = objUpload.Files("Thumbnail1_" & I)
    
        objFile.SaveAs (Server.MapPath("Gallery/" & I & ".jpg"))
        'Fetch thumbnails and save it to disk
    
        Set objFile = objUpload.Files("Thumbnail2_" & I)
        objFile.SaveAs (Server.MapPath("Gallery/Thumbnails/" & I & ".jpg"))
    
    Next
    %>
  • Best regards,
    Fedor Skvortsov
    Users browsing this topic
    Similar Topics
    HOWTO: Upgrading from Image Uploader 1.x to 2.x step by step (Image Uploader)
    by Fedor 4/5/2004 6:00:00 AM(UTC)
    Forum Jump  
    You cannot post new topics in this forum.
    You cannot reply to topics in this forum.
    You cannot delete your posts in this forum.
    You cannot edit your posts in this forum.
    You cannot create polls in this forum.
    You cannot vote in polls in this forum.