Resizing FileReference image then reuploading, only reuploads original image - apache-flex

I can;t figure out how to do this. Someone selects and image after calling FileReference.browse(). I take that image and make a thumbnail in flash.
Then I upload that image like so:
var newFileReq:URLRequest = new URLRequest(FILE_UPLOAD_TEMP);
newFileReq.contentType = "application/octet-stream";
var fileReqVars:URLVariables = new URLVariables();
fileReqVars.image = myThumbImage;
fileReqVars.folder = "Thumbs";
newFileReq.data = fileReqVars;
newFileReq.method = URLRequestMethod.POST;
//upload the first image
fileRef.addEventListener(Event.COMPLETE, onFirstFileUp);
fileRef.upload(newFileReq, "Filedata");
All this does it upload the original image. How do I change the fileRef to upload the new thumb? I have traced out the size of the "myThumbImage" and it is correct. I have placed it visually on the stage after creating the thumb, and it seems like it works. But when I upload it to an aspx page (that basically just throws it into a folder), it uploads the original larger image.

It won't work this way. FileReference.upload can only upload the file you opened, you can not override the image for security reasons.
What you should do to achieve this is encode the thumbnail data properly using Base64 (and use something like as3corelib to encode it to jpeg or png first if your thumb is just a bare bitmap data), and then use URLLoader to post the thumb to the server.

Related

Display resized image as a return value and not as page content

On Page_Load, I want the page to display an image the same way it displays when you "Open image in a new tab". In other words, I want the page to display as content type Image/jpeg instead of rendering the image in img HTML tag.
I successfully displayed an image this way using the below code on Page_Load:
Page.Response.ContentType="image/jpeg"
Page.Response.WriteFile("Path_to_the_Image")
However, my case requires displaying the image after being resized. I created a function that resizes the image and returns the resized image as Drawing.Bitmap
ResizeImage(bmSource As Drawing.Bitmap, TargetWidth As Int32, TargetHeight As Int32)
How can I use the returned value of that function and display it the same way I displayed the first image?
Page.Response.WriteFile() requires a String as an input. Is there a way where I can display the image of type Image or System.Bitmap directly into the page without having to save it in a temp folder and then use its path (As a String) and pass it to Page.Response.WriteFile?
Page.Response.ContentType="image/jpeg"
Using resizedImage As Bitmap = ResizeImage(source, 100, 100)
source.Dispose()
resizedImage.Save(Page.Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg)
End Using
Page.Response.Flush()
That should work, maybe there's some error in my syntax. I do not often code in vb.net so.
Edited the code because of #Joel Coehoorn note

RDLC: How to show external images in Internet Explorer

using a ReportViewer to show my reports: I have a RDLC with a parameter for an external image path.
the image is saved on the server.
Parameter value =
"file:///" + Server.MapPath("~/images/img.png")
this works on all other browsers but on IE it does not, however, if I export to PDF the image is visible.
Any ideas why this could be?
PS: I also tried using the complete URL of the image to no avail.
tested image url by posting in on the browser, url is fine.
How about:
string imagePath = new Uri(Server.MapPath("~/images/img.png")).AbsoluteUri;
ReportParameter parameter = new ReportParameter("ImagePath", imagePath);
ReportViewer1.LocalReport.SetParameters(parameter);
ReportViewer1.LocalReport.Refresh();

IE not loading all images in a page with large no: of images(~ 300+ images)

I have a webpage which is trying to render more than 300 images, but IE is not rendering all the images. I have detailed the exact scenario below.
I have a aspx page with a asp:Panel. I'm adding new aspx pages to this panel,
Image image = new Image();
StringBuilder url = new StringBuilder();
url.Append(string.Format("ImageDisplay.aspx?Sample={0}", 1));
image.ImageUrl = url.ToString();
HtmlGenericControl div = new HtmlGenericControl("div");
div.Controls.Add(image);
this.pnlImages.Controls.Add(div);
the second aspx page writes the image to the response,
Response.Clear();
Response.BufferOutput = true;
string fileName = "..\\Sample.jpeg";
Bitmap image = new Bitmap(fileName);
image.Save(Response.OutputStream, ImageFormat.Jpeg);
image.Dispose();
Response.Flush();
likewise I'm adding more than 300 images.
IE is not rendering all the images properly, most of the images are getting broken and shows as 'X' sign. While the same page loads perfectly fine in Firefox and Chrome. I'm not able to find the cause of the issue since it only happens in IE. Could someone please help me with this.
May get some help here...
Multiple image handler calls causing IE to hang in pop-up window
Load images fail when I pick multiple image files in my metro style app

Where to store and how to remove images in a photo gallery?

I'm working on a photo gallery using ASP.NET.
I'm storing user's images in a SQL database. I'm not sure how should displaying images look like.
Let's say there is 1 picture per user, I was doing something like that:
get image from database
save it on server's disc as "file.jpg"
ASP:Image.uri = "file.jpg"
And that worked fine until I found out that If few users loads that page at the very same time, It might not work properly.
Then I though changing "file.jpg" into some random string would help me:
get image from database
save it on server's disc as "ABCDUDHDJSAKFHADGJKHAKADFAD.jpg"
ASP:Image.uri = "ABCDUDHDJSAKFHADGJKHAKADFAD.jpg"
File.Delete("~/ABCDUDHDJSAKFHADGJKHAKADFAD.jpg");
But it wasnt possible to delete this file because it was still being used by a server.
What would be the proper way to solve my problem? User in my photo gallery will eventually see 12 photos at the same time.
What I usually do is serve images from DB using a generic handler (ashx file).
What you need to do is create an ashx file and use something along these lines:
context.Response.BinaryWrite(myImage);
The you create image tags like so:
<img alt="whatever" src="/images.ashx?iid=1243 />
Where iid is the unique ID of the image in the DB.
You should not store the file actually. You should stream it. For example create a handler which returns the image from an user with a specific ID and call it with that ID like image.ashx?id=1. The handler could look like
Image image; // image from your database
using(MemoryStream ms = new MemoryStream())
{
image.Save(ms, System.Drawing.Imaging.ImageFormat.Png);
ms.WriteTo(context.Response.OutputStream);
}
Response.ContentType = "image/png";
This handler you can use like a static image file. So, you might even use it for a background-image:
<div style="background-image: url(image.ashx?id=1)">Username</div>

How can I set an Image received from a method to the ImageButton?

I have a method that returns an Image.
How can I assign that Image to my ImageButton control so it has that image set?
Since you're dealing with HTML, you'll need to save the Image to a file, then use that file in the ImageButton's ImageUrl property.
I believe an ImageButton takes the path to an Image, not an actualy Image object, as the browser renders it a an tag.
What you could do is save thr image to disk, return the path to the image form your method and then have
<asp:ImgageButton id="imgButton1" runat="server" imageUrl="<%= GetImageUrl()>" />
The above syntax is not exact, it might be "<% Response.Write(GetImageUrl())>" but you get the picture
If this method returns an Image object, you will need to save out the image to a physical location on your webserver (somewhere like Server.MapPath("~/images/")). Then you will need to set the ImageUrl property of the ImageButton control to this location.
If this method returns a relative path to the image file, simply set the ImageUrl property of the ImageButton to the path returned by the method.
In short, you can't. Well not directly anyway.
You will have to write your image to file and point the image button at your image file
or you can have a web page that returns the image in the response and use that as your ImageUrl
The reason for this is that your ImageButton just renders to HTML which has no support for attaching images ATM.
You can try the following approach:
1) Firstly, get the binary data from the image:
public byte[] ImageToByteArray(System.Drawing.Image image)
{
MemoryStream ms = new MemoryStream();
image.Save(ms, System.Drawing.Imaging.ImageFormat.Gif);
return ms.ToArray();
}
2) Secondary use Inline Images with Data URLs idea:
Inline images use the data URI scheme
to embed images directly within web
pages. As defined by RFC 2397, data
URIs are designed to embed small data
items as "immediate" data, as if they
were referenced externally. Using
inline images saves HTTP requests over
externally referenced objects.
System.Drawing.Image image = GetImageFromSomewhere(...);
byte[] imageData = ImageToByteArray(image);
string imageBase64 = Convert.ToBase64String(imageData);
string imageSrc = string.Format("data:image/gif;base64,{0}", imageBase64);
imgButton.Src = imageSrc;
But unfortunately, this won't work for IE5-7 (should work in IE8).

Resources