Currently i'm investigating the possibilities to show dynamic images in our ASP.NET webforms application.
For example. we want to show the end user a 7 segment display on a web page, but before showing it, we need to change some things in this image, according to some settings in the databse, for example changing colors or set visibility of the segments, change background colors of elements etc.
Since our end users do not have the ablity to install browser plugins like Flash or Silverlight, it has to be something that is native supported by all recent browsers (maybe something like HTML5 or SVG?).
The main images should be created in design-time with some sort of WYSIWYG editor, like Illustrator or Blend or something. In run-time, we need to manipulate the image from C# (if serverside), or maybe even javascript (if clientside).
The main question is, are there eny techniques you would recommend, or are there any existing frameworks or libraries to accomplish this? Can this be easily done with SVG or HTML5 (canvas?)
I hope anyone can point me in the right direction, or provide some tips or maybe a good tutorial...
When I had to do something like this I used a new HTTP Handler. There in ProcesRequest you can load the image in a Bitmap object and modify it in-memory. After you are done you can write the image to the response.
//load the main image
var bmp = new Bitmap(200, 200);
//draw here
bmp.Save(context.Response.OutputStream, ImageFormat.Png);
context.Response.ContentType = "image/png";
context.Response.Cache.SetCacheability(System.Web.HttpCacheability.NoCache);
context.Response.Cache.SetNoStore();
After having a handler like this you can add to the HTML. Make sure the response is not cached so the images are really dynamic.
Storing and editing the main image is a different question.
Related
We are building an sitecore app that is largely image base content.
Currently we are seeing performance slowdown on pages with lots of images on iOS.
Most of our images are in sprites, but user images are currently loaded one by one.
Has anyone come up with a way to generate sprites from images uploaded to sitecore ?
I found this blog post about how to handle sprites in Sitecore with svg.
I hope it will help you to resolve your issues.
I've done some concept work on this topic before, but haven't yet found the time to do a real implementation. But I'll try to share a few of my thoughts on how to do this.
First you have to identify the images that should be in the sprite. This can be done at the page request by traversing the item fields and potentially the related items, or if you have any other logic where you can get this. If the list is static, it would be even better to determine this at publish time. Essentially you need each image guid, width and height. You'll also need to look into what image sizing rules you have. The images in the sprite needs to have a similar width or height in common. Otherwise it would be hard to group them without having large blank areas.
When you have the set of images, you can get the MediaItems and find the information needed to build the html code for the sprite. Essentially the X and Y coordinates where each image will be located in the sprite, so that you can render the html correctly. This would also result in an object that contains all the information to create the sprite. This object can be assigned a guid, that you can use in the image url to request the sprite.
Note that if you're on a multi-server environment, you'll have to look deper into what strategy you want to use for persisting the data about the sprites. You could for example store it in Mongo if you have it, or use a database that is accessible from all content deliver servers. In a multi-server environment the html-request may be on one server and the image sprite request on another server, so it must be possible to retrieve or build the sprite from the information in the image url alone. (This would be best practise in a single server env as well, but it becomes a lot simpler)
Then you'd create an image request handler that gets the sprite object guid, and from the persisted sprite object, it'll get the media items, optionally perform resizing etc, and render those onto a Bitmap. The Bitmap can then be saved as jpg/png and cached on disk (or other suitable service) and returned to the client.
There are of course a lot of different ways to do each part of this and most of it would depend on what data you can put into your sprites (data driven, hand-picked by users on the current item or related items, usage of personalization etc etc), if you can perform pre-calculations of the sprite object and generate the sprite at publish time or if it has to be done render time, what your hosting environment looks like etc etc.
Hope this helps
I'm trying to embed/display a PDF in a WPF application. So far, I've tried those solutions, without success:
Display the PDF in a WindowsFormsHost hosting an AxAcroPdf
control, similarly to what's shown here. The problem is that my application sets AllowsTransparency
= True to create a style similar to Modern UI, but
that doesn't blend well with a WindowsFormsHost (the control
becomes invisible).
Display the PDF in a WebBrowser control. The problem is the same.
Set AllowsTransparency = False, but this causes a sluggish feeling in the application. Since I use WPF purposedly to enhance the look and feel of our business applications to the benefit of our end-users, this can't be a solution.
Use a second window with AllowsTransparency = False to display the WindowsFormsHost, and hack it to make it look like a child control of the main window, as it's described here. However, I don't like the code-behind approach since I'm using MVVM.
Find a native PDF control for WPF. However, I only found a couple of commercial ones and that's not an option right now.
What I need is to be able to:
Display a PDF or its representation (i.e. an image or a conversion to another format) in a WPF application.
Keep my style visually intact and fluid (AllowsTransparency must stay True).
Use an approach respecting the principles of MVVM (preferably no code-behind).
Include it in my application for free (for commercial usage).
I'm totally open to hand-made solutions, open-source libraries and even completely different approaches.
I have two solution for this:
Open your .pdf file and then print as an .xps (also you must be able for doint this in code), then this file you can embded this file in your app, and show it as a xps document. See this: Documents in WPF - MSDN - Microsoft (XPS)
To use a free library, I'm not very sure if this allows show pdf, but it generate them, you can take a look at EO-Pdf.
Hope this tips helps to solve the problem.
If you're opened to Open-Source solutions, I would recommend GhostScript. You can convert the PDF (with decent quality, for the most part) to individual image files of most any format you might want to work with.
The other option is to convert the PDF to HTML using pdf2htmlEX, but it will currently only compile for Linux.
I use both of the above solutions in several applications on both Linux and Windows. The advantage to the HTML way is that the text can be copied and pasted. The advantage of the GhostScript way is that the images might be more portable (smaller).
As with any open-source solution, you need to be aware of the terms of the license under which each product is released, and how that may impact your final result.
There is a good solution that I used before is to use CefSharp. It's the Chrome browser engine that supports previewing PDF documents.
Visit quick start page.
It is recommended to visit Troubleshooting page to set appropriate settings if you have problems.
If you want to show PDF files on your local drives you should also use these settings for the browser and then use file:/// protocol:
CefSharp.BrowserSettings browserSettings = new CefSharp.BrowserSettings();
browserSettings.FileAccessFromFileUrls = CefSharp.CefState.Enabled;
browserSettings.UniversalAccessFromFileUrls = CefSharp.CefState.Enabled;
browserSettings.TextAreaResize = CefSharp.CefState.Enabled;
my_bowser.BrowserSettings = browserSettings;
I have created a custom web part for Kentico that needs to allow the content manager to select an image from the media library that will be set as a background image in a div. The form control I am using is Media Selection. Does anyone know how I can write the aspx and c# code to display the selected image? I feel like this should be an easy answer but I am coming up short. Any help would be great!
You can use MediaFileInfoProvider.GetMediaFileAbsoluteUrl() or MediaFileInfoProvider.GetMediaFileUrl() to get absolute or relative URL of the desired image and use it in aspx markup or codebehind. If you want to get "nice" URL, use example described here.
Related Stack Overflow question is Programmatically get a screenshot of a page.
My users will be logged into a private system, and I want to have a button on the page that says "Take Screenshot". This will link into the support system, and when they take the screen shot, it creates a new ticket with the screen shot as an automatic attachment.
Content is variable, depending on who you are logged in as! This means I can't use an external screen shotting tool.
Ideally, I would like all the HTML to be rendered to a bitmap which is saved to a disk. Is there some sort of server-side Internet Explorer component that can render the HTML and save it as a BMP?
Kierren made good points. If I can grab the HTML via JavaScript, is there any server-side plugin that can render the HTML as an image as viewed through Internet Explorer?
I did some unsuccesful attempts with that in the past. I could not get the solution which works seemlessly but here are some I have had near-sucess (i.e. for most of the URLs) [Since I was doing POC, results did not matter] See if that helps
WebBrowser.DrawToBitmap() or other methods?
http://www.codeproject.com/KB/graphics/html2image.aspx
I have not heard of an HTML-to-bitmap converter before, but there are definitely HTML-to-PDF options,
http://www.htm2pdf.co.uk/
and
http://html-pdf-converter.com/
to name a couple.
The WriteableBitmap class that was introduced in Silverlight 3 does not allow images to be rendered from a different domain for security reasons and hence it is impossibe to output an image of the Bing Map.
Does anyone have any suggestions for a workaround? I just want to capture a snapshot of the image including the controls and shapes I have drawn on the overlying canvas
Thanks
Paul
There is a workaround - the bing maps silverlight control allows you to specify a custom configuration. In this configuration, you can specify your own URLs for images, and make them so that they are not cross-domain, and hence not "insecure".
However, there is a bug in Silverlight which causes the workaround to fail. See here: https://connect.microsoft.com/VisualStudio/feedback/details/628962/
The sample attached to the bug report in the link above shows how to specify a custom map control configuration.
Did you try Bing's Imagery Service? See
http://msdn.microsoft.com/en-us/library/cc966738.aspx
It would be shame if something that is inplace for good security reasons could then be worked around, wouldn't it?
It may be that your true goal might be achievable using some other approach but you don't state what that is.
For example, you might want to generate some simple image that can then be hosted on a web site to be downloaded. A possible workaround would be to use the Silveright print API to print the desired content. Use a PDF generating printer driver you could then upload the generated PDF to the site
Of course this example may be far from your purpose. State your intent and a more lateral work around may be offered or at least a definitive, "no you can't".