Java to Html5 migration with S3 in ASP.NET

I am attempting to replace my java uploader with html5. We upload directly to S3 then callback to record the filenames and details in our database. When we upload we change the filename to a GUID to avoid overwriting existing files. To prepare to do so I use this javascript code at the end of the page:

<script type="text/javascript">
    // Save keys in temporary array
    var uploader = $au.imageUploaderFlash('html5Uploader');
    for (var i = 0, imax = uploader.converters().count() ; i < imax; i++) {
      fileKeys.push(as3.converters().get(i).key());
    }
  </script>

fileKeys is declared in the HEAD as var fileKeys[];

In the java version we assigned the AmazonS3Extender into the as3 variable like thus:

    private void OnPreRenderComplete(object sender, EventArgs e)
    {
      // Get the preRender client event handler
      var preRender = html5Uploader.ClientEvents.First(ev => ev.EventName == ClientEventNames.PreRender);
      // Add a page variable to reference the amazonS3Extender
      preRender.HandlerName = preRender.HandlerName.Insert(preRender.HandlerName.Length - 1, " window.as3 = as3;");
    }

This does not appear to work for the html5 uploader. How do I gain access to the extender?

Thanks,

Mike

0x800a138f - JavaScript runtime error: Unable to get property 'converters' of undefined or null reference

I think I still need this javascript because it also is used to post back details of the upload (including original filename) to out internal server when all the files have been uploaded to S3.

Mike

Originally Posted by: mmount

This seems to return null for as3.

0x800a138f - JavaScript runtime error: Unable to get property 'converters' of undefined or null reference

It may mean that this code is running before amazonS3Extender is created and initialized or $au.imageUploaderFlash('your-id') did not find the uploader (see explanations below).

I think it makes sense to do it in the initComplete event handler. In other words, you should wrap your code to a function:

<script type="text/javascript">
var myInitComplete = function() { 
    var uploader = this;
    var as3 = uploader.amazonS3Extender();
    for (var i = 0, imax = uploader.converters().count() ; i < imax; i++) {
      fileKeys.push(as3.converters().get(i).key());
    }
}
</script>

And then specify this function name in the control:

	    <aur:ImageUploaderFlash ID="html5Uploader" runat="server"
			<ClientEvents>
					<aur:ClientEvent EventName="InitComplete" HandlerName="myInitComplete" />
			</ClientEvents>
	    </aur:ImageUploaderFlash>

Please note that the ID of the uploader in JavaScript may differ from the ID specified in ASP.NET code (as usual it prepends some stuff like "ctl00_content_"). That's why when you need to receive the uploader instance, you should not specify it like $au.imageUploaderFlash('your_aspnet_id'). Instead, you should use the ClientID property of the control: $au.imageUploaderFlash(<%= Html5Uploader.ClientID %>). Also, in event handlers, you can get a reference to the uploader using this, like in the code snippet above.

BTW, why not to store original filenames as Amazon S3 Metadata? You can easily configure uploader to send them along with files. Our demo application illustrates how to send width/height, but it is easy to do it for the file names as well:

http://demo.aurigma.com/...nS3Metadata/Default.aspx

Here you can find a documentation how to do it:

http://www.aurigma.com/docs/us8...torages-uif.htm#metadata

No, unlike of file.guid(), the ${guid} produces really unique identifiers (file.guid() are unique only while a page is loaded and they are "human-readable").

If you explain a bit more detailed how you are using your AWS storage and why you need to post back a list of files you have uploaded to a server, I could suggest an optimal way to do it.

Edited by user Monday, September 21, 2015 9:21:07 PM(UTC)  | Reason: Not specified

Originally Posted by: mmount

<Restrictions FileMask="[['Images', '.jpg;*.jpeg;*.jpe']]" MinImageHeight="200" MinImageWidth="200" MaxFileCount="999" />

I found that I had accidentally deleted the first * from *.jpg :(

Mike