Automatically create thumbs on image upload

[gkpurcey]

Is anyone automatically creating thumbs when uploading an image so that the folder can be used with the image gallery component?

Would like this to be transparent to the user, i.e. you select an image file for upload and it gets stored as a fullsize image in the folder and a thumb sized image in the thumb folder with the same name.

[Davidk]

Re: Automatically create thumbs on image upload

How's your Xbasic, Gordon?

I believe you'll need to use the File Upload - User Defined Action Script, and then run an Xbasic function on the uploaded image(s). The Xbasic function prototype gives you everything you need to work with the images.

To get the thumbnail you could use ImageMagick, which would need to be installed on the server. A5 has built-in ImageMagick commands.

Is that enough to get you started?

[gkpurcey]

Re: Automatically create thumbs on image upload

Thanks David...

Always up for a challenge! Although my X-basic skills are, shall we say "basic" (My background is using Delphi), it doesn't sound too daunting!

I'll give it a go, and see what happens... Thanks for heading me in the right direction.

[gkpurcey]

Re: Automatically create thumbs on image upload

Turns out this wasn't really too bad afterall.
Here's what is working for me:

function createthumb as v (e as p)
'This function is called when the uploaded image data is saved to a record in the Grid.
'A possible use of this function would be to save a thumbnail of the uploaded image in another field in the current record.

'Request - The Request object. Includes Request.Variables, which should be used instead of the older e.rv construct
'Session - The Session object. Should be used instead of the older e.session construct

'The e object that is passed in contains:
'e.tmpl  - the Grid definition
'e.rtc - a pointer variable that is passed to all server side events
'e.__si - state information
'e.ops = misc properties that were defined in the builder for the image upload action
'e.tableType - 'SQL' or 'DBF'
'e.tempImageFilenameOnServer - temporary file in the session folder where the uploaded image was stored

'If the Grid is based on a SQL database (e.tableType = 'SQL'), then e contains:
'e.cn - a pointer to an open connection to the database
'e.args - the sql::arguments object that contains the data that was passed to the query that saved the data
'e.targetFieldType - the data type of the field in which the image is stored ('C' - character or  'B' - binary)
'e.embeddedImageFormat - in the case where the image is embedded, the format (jpg or bmp) that the image was converted to before it was stored in the table

'If the Grid is based on a DBF database (e.tableType = 'DBF'), then e contains:
'e.targetFieldType - the data type of the field in which the image is stored ('I' - image file ref, 'C' - character,  'J' - jpeg, or 'B' - bmp)
'e.tbl = tbl - pointer to the open table in which the uploaded imaged was stored - DO NOT CLOSE THIS TABLE!!.

'e.imageFilenameOnServer - if the image was linked (i.e. stored in a Character field or Image File Ref Field (dbf only)), the full filename of the image file on the server. This property if blank if the image is embedded.
'e.imageBlob - if the image is embedded, the binary image data (after it has been converted to the required type)
'e.valueStoredInField - if the image was linked (i.e. stored in a Character or Image File Ref Field (dbf only) ), the actual filename (after it has been transformed) that was stored in the character field.
	
dim result as p
dim file as c
dim path as c
dim fname as c
file = e.imageFilenameOnServer
path = file.filename_parse(file,"dp")
fname = file.filename_parse(file,"ne")


 result = a5_runimagemagiccommand(e.imageFilenameOnServer,path+"thumbs\\"+fname,"-resize x150" )


end function

This allows me to insert a smaller thumbnail image into a subdirectory of "images" called "\thumbs" all in one step.

I call this from the "On Save" server side event of the Upload Image Action Javascript "on click" function.

[Davidk]

Re: Automatically create thumbs on image upload

That'll do it... nice.

[mastermind315]

Re: Automatically create thumbs on image upload

This feature is now included in V12.

http://www.youtube.com/watch?v=fpErt...em-uploademail

[gkpurcey]

Re: Automatically create thumbs on image upload

Thanks Elliot. Looks like a very nice addition to the toolbox...

[dionmccormick]

Re: Automatically create thumbs on image upload

Follow up question for the development team. Using the V12 release, I am successful at creating the thumbnail. But....I would like an easy method for adding a unique identifier to the image. For example, I want to create an avatar for a user. So I want to use the users unique id from the database to "map" the user to the saved file. It would be great if you could add the ability in the Transformation Expression to add any of the fields from the current dialog. It could use the {...} syntax to add the unique identifier to the file name for saving to the folder.thumbnail.jpg

[Davidk]

Re: Automatically create thumbs on image upload

Hey Dion, you should post this question in the Beta Version 12 section... but since you're here...

Are you using the Image Upload action on a UX? And, is it Mobile?

David

[dionmccormick]

Re: Automatically create thumbs on image upload

I am using the Image Upload action in my UX component.
It is not mobile. I am enclosing a snapshot of the dialog.imageupload.png

[dfricke10]

Re: Automatically create thumbs on image upload

V12 does include the thumbnail feature, but it adds a suffix to it like _thumbnail. Even if you leave the suffix field blank, it still adds the "_" character to the end. like filename_.jpg. Thus, the Image Gallery component will not see these because the original file and matching thumbnail do not have the exact same name.

Anyone figured a way around this yet?

[Davidk]

Re: Automatically create thumbs on image upload

David,

The latest release of Alpha Anywhere solves this. Thanks to Selwyn... if there is no suffix provided and the file does not already exist, then the thumbnail will be saved as the original upload filename. If the filename does exist then an "_" is appended to the filename so an overwrite does not happen.

David

[dfricke10]

Re: Automatically create thumbs on image upload

Thanks David. Got that info from Selwyn. I emailed him about it and he was gracious enough to make sure that was updated. I guess I should have updated this thread. But thanks for letting me know.

[Davidk]

Re: Automatically create thumbs on image upload

Yes, that was a good change. Now the Image Upload and Image Gallery Component work beautifully together.