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

Notification

Icon
Error

Options
Go to last post Go to first unread
Dmitry.Obukhov  
#1 Posted : Monday, August 16, 2010 5:01:07 PM(UTC)
Dmitry.Obukhov

Rank: Advanced Member

Groups: Member
Joined: 5/29/2010(UTC)
Posts: 1,310

Thanks: 8 times
Was thanked: 111 time(s) in 111 post(s)
Some of our clients ask us how to add a checkbox to each preview image. If checkbox of particular image is selected, Image Uploader should do some action with this image or its thumbnail, e.g. add a watermark as in our case.

Our engineer created the simple application based on MulipleDescriptions sample. It allows applying a watermark to an image when image’s checkbox is checked off.
I attached .zip file with this sample for your reference. You can find there script.js file where the method addUploadFileHtml(index) is implemented:
Code:

function addUploadFileHtml(index) {
    var guid = imageUploader1.getUploadFileGuid(index) + '';
    var fileName = new String(imageUploader1.getUploadFileName(index));
     /*… Code ... */
    //Add Chackboxes
    h += "<input id=\"checkbox" + guid.replace(/[^0-9abcdefABCDEF]/g, '') + "\" class=\"checkbox\" 
    value=\"a1\"   type=\"checkbox\" align=\"middle\" checked /> <label for=\"checkbox" + 
    guid.replace(/[^0-  9abcdefABCDEF]/g, '') + "\">Watermark</label><br />";
     /*… Code ... */
}

Also, there is the method ImageUploader1_PackageBeforeUpload(packageIndex) where we will apply a watermark, if image is selected:
Code:

//This function adds the watermark to the images, which are checked off in the upload pane. 
function ImageUploader1_PackageBeforeUpload(packageIndex) {
    var guid = imageUploader1.getUploadFileGuid(1) + '';
    var cb = document.getElementById("checkbox" + guid.replace(/[^0-9abcdefABCDEF]/g, ''));
    if (cb.checked) {
       //Apply watermark 
       imageUploader1.setUploadThumbnail1Watermark("opacity=100;ImageUrl=Watermark.png;
       ImageWidth=155;ImageHeight=30;Position=BottomRight;");
    }
    else
       //Do not apply watermark
       imageUploader1.setUploadThumbnail1Watermark("Position=TopLeft ");
}

Please download and try this sample. Post any questions or comments about it here. I will be glad to assist you.

Edited by user Tuesday, August 17, 2010 3:55:10 PM(UTC)  | Reason: Not specified

File Attachment(s):
CheckboxWatermarkSample.zip (3,141kb) downloaded 11 time(s).
Best regards,
Dmitry Obukhov
Technical Support. Aurigma, Inc.
Users browsing this topic
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.