How to Display Uploaded Image from File System - asp.net

I'm attempting to modify an inherited project that has a convoluted process of displaying uploaded images using an ImageMap control.
The current process inserts a new database record with image file name as well as model number and part number. The image files are saved to a virtual directory visible to IIS. Each part number has a corresponding .htm file containing an image map referencing the uploaded image. The image map has to be sized for each part and saved in the file system.
How can I streamline this process using either client side or server side controls? I'd like to bypass use of image maps as they require manual sizing. Can a control be used that auto sizes the image? Should the images be stored inside the database or kept in the file system?
Thanks for your advice;)

Storing the images in the database is IMHO a much more scalable solution.
Take a look at the Image Resizer project and its associated plugins for a way to resize the images, regardless of where you store them:
http://imageresizing.net/
http://weblogs.asp.net/bleroy/archive/2011/10/22/state-of-net-image-resizing-how-does-imageresizer-do.aspx
http://nathanaeljones.com/163/20-image-resizing-pitfalls/
You could use regular ASP.NET controls to display the images, for example, a ListView.

Related

Liip ImagineBundle custom resize without caching

I am using Liip ImagineBundle for managing the pictures in an auction listings project. The setup is as follows - when an auction listing is being created I am using Plupload to upload the picture set (with AJAX prior to persisting the auction). The pictures are uploaded into /pictures/temp folder with a temporary hash name. Upon persisting the entity, a Doctrine Subscriber renames the uploads in the temporary folder to use a format:
{AUCTION-ID}-{SIZE}-{TIMESTAMP}.{EXTENSION}
where the size is the version of the image - XL, large, medium, etc. and based on the timestamp creates a subfolder as:
/pictures/{YEAR}/{MONTH}/{DAY}/{PICTURE}
This allows for preventing millions of pictures to end up in a single folder and slow the file system. I am using a custom file loader and cache manager to resolve the pictures based on the timestamp. It all works perfectly fine but I have a request to display the uploaded pictures in a preview while doing the Plupload. The problem is in the resizing and caching with the ImagineBundle. What I would like to achieve is have the uploaded picture (the {HASH}.jpg in /pictures/temp) be resized to a specific size and at the same time a thumbnail to be generated off that as {HASH}-thumb.jpg. I know I can make it with another file loader and a cache manager but I was wondering whether it is possible to done via the bundle in some other way which is simpler as both these files are temporary ones and will be deleted upon the creation of the auction.

How to change the background image IBM mobile anywhere app in login page

I am looking to re-design the Login page. I need to add a new background image. Let me know where should I be copying this image into the project and where should I be specifying the image reference. I see the change made directly into Login.html are not reflecting in the output.
There are two logos in Maximo Anywhere, ibmLogoDark.png and ibmLogoLight.png (for the light and dark backgounds). You will need to obtain suitable replacement (transparent backgound) logo gifs or png files from your customer, of an equivalent size.
The IBM logo image files are in:
\MaximoAnywhere\apps\WorkExecution\common\js\platform\ui\control\images\mdpi
and also in:
\MaximoAnywhere\apps\WorkExecution\common\idx\mobile\themes\common\idx\images
So that is where I put copies of my customers replacement logos.
You'll want to give them different names from the IBM logos just so they don't get overwritten so easily. There are 4 CSS files you need to update to the new name:
about.css, launch.css and login.css in:
\MaximoAnywhere\apps\WorkExecution\common\idx\mobile\themes\common\idx
and mdpi.css in
\MaximoAnywhere\apps\WorkExecution\common\js\platform\ui\control\css
There are also two app.xml files you need to update to point to the new names. One in each of:
\MaximoAnywhere\apps\WorkExecution\platform-artifacts\dialog
and
\MaximoAnywhere\apps\WorkExecution\platform-artifacts\login
Then rebuild and you're done. Oh, and make sure you clear your browser cache (or use incognito mode) to test.

how to images store localy from xml using flex 3?

I have one xml link. that link have collections of images(apx 1000 images).
when i flex applications start at the time load all images in locally. then when i need that images then use it.
How i do this... give me some links and logic.
Using flex 3.
Thanks advance.
senthil.
Load the .xml form server or so.
Parse the .xml and create a Map where you store all the image URLs
Place an Image Component on your UI and set the "source" property to the value of the image URL
Flash Plugin will load the image from the URL and will show the image when done.
If you are facing a "SandboxVaiolationException" (or something like that) you need to tell your server to let the request go.
If you want to change the "source" Property of the Image at runtime, just set it after a click oder an other Event. (is no problem)

How do I rotate an Image in .NET?

I have an asp.net 2010 project. I write a jpg to the filesystem. Then I display it in an Image control. Then I use this code on button click to allow the user to rotate it 90 degrees.
string path = Server.MapPath(Image1.ImageUrl) ;
// creating image from the image url
System.Drawing.Image i = System.Drawing.Image.FromFile(path);
// rotate Image 90' Degree
i.RotateFlip(RotateFlipType.Rotate90FlipXY);
// save it to its actual path
i.Save(path);
// release Image File
i.Dispose();
It does rotate (I can actually watch that happen in Windows Explorer). But when I run the app again and it grabs the file from its path, it still displays it in its original form.
Try adding a dummy querystring to the end of the image like "image1.jpv?v=1". This works to prevent caching for things like Javascript files and it may do the same for you.
This is the classic issue with browser-cached resource files. Alison's answer is one option. Another option is to change the name of the physical file. If you "version" the files, then after each change, the file name will be different. This does mean that you'll have to dynamically reference the image path so that you display the correct version, and you'll need some way to determine the file name for the current version. It does prevent the browser from displaying the previously cached file immediately after a change, though, because it's technically a new file to the browser at that point.
If you are using some sort of data source (XML files or database) to store metadata for the images, then you can add a "Version" column and store a simple integer. With each change, increment the integer value and use the new value in the file name. You can even extend this by saving the previous versions and allowing your users to "undo" actions by copying an older version of the file into a new version. This might require a more robust metadata storage implementation, though.

Want to dynamically get images from a database and set it to CSS background

This is something I just couldn't figure out how to do in ASP.NET:
I have a database of photographs, with upload/management and all that.
What I want to do is to dynamically change/create a css file that changes the background of a div to one of the selected images on the database. (bing.com style).
Is this possible using images stored directly on the database? (sql2008)
Or maybe possible only using uploading images to a directory and saving it's path/name on database?
you would use an HttpHandler to read the image from the db and serve it up. Then you could also create an HttpHandler to create a small css file for the background css.
See http://msdn.microsoft.com/en-us/library/f3ff8w4a(VS.71).aspx
This SO search has lots of articles along your line. Perhaps a few of them will give you some ideas.
https://stackoverflow.com/search?q=ASP.NET+image+database

Resources