Skip to content

How to save a HTML5 canvas as a downloaded image and name the file

I had been trying to find a way to save a HTML5 canvas object as an image but also to nbame it to your preference which was not an easy find on the web to do. Luckily I have found something in Chrome that can do this by saving the file as an PNG of the selected HTML5 canvas but also to name the file as test.png

Here’s how: -

        var ua = window.navigator.userAgent;
        if (ua.indexOf("Chrome") > 0) {
            // save image without file type
            var canvas = document.getElementById("canvas");
            document.location.href = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
            // save image as png
            var link = document.createElement('a');
   = "test.png";
            link.href = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");;
        else {
            alert("Please use Chrome");

Useful Tip for getting HTML component tags by class name

Here is a quick tip for getting HTML component tags by class name.

To do this, you need to call the getElementsByClassName with the class name, and as the result is stored as an object array, you call the nth element, e.g the first element is called y[0], and to get the HTML content, you use innerHTML. If there is more than one element with the same name, you call y[1] etc.

See below.

var y = document.getElementsByClassName(“SmallTabSelected”);
var getValue = y[0].innerHTML;

How to allow SQL Server Agent to be run

If you receive the error message “Ad hoc update to system catalogs is not supported” when trying to activate the SQL Server Agent and the message “SQL Server blocked access to procedure ‘dbo.sp_sqlagent_get_startup_info’ of component ‘Agent XPs'”
You need to run the following commands to fix the issue

Allow updates is used to set up direct ad-hoc updates to system catalogs and tables. This is set to default to 0, but for some instances, it may have been set to 1 beforehand, so here you are setting it back to 0.

EXEC sp_configure ‘allow updates’

You can then enable the use of Agent Xps by using sp_configure because SQL Server blocked access to procedure ‘dbo.sp_sqlagent_get_startup_info’ of component ‘Agent XPs’ because this component is turned off due to security. You can enable it by the following:-

sp_configure ‘show advanced options’, 1;
sp_configure ‘Agent XPs’, 1;

Mapping Operation War Diary


Interesting mashup colloboration!

Originally posted on Operation War Diary:

Tens of thousands of maps were produced by British forces during the first world war, from large-scale maps for senior commanders needing an overview of an entire front, to much more detailed topographical maps for front-line troops, which allowed them to accurately pinpoint enemy positions and establish the nature of the ground they held.

Many of these maps are preserved in the unit war diaries, with Citizen Historians uncovering more each day. One of the great benefits of tagging the war diaries is that it allows us to continue the mapping work carried out during the war itself, using modern techniques to establish a visual representation of the events of the time and the experiences of the units to whom the diaries belong


Image © IWM (Q 2306)

One way in which we can do this is to use place names, particularly those we can locate on the mapping tool…

View original 191 more words

How to allow ASP.NET MVC to be enabled on IIS6

Here is a extremely useful tip for allowing ASP.NET MVC to be used on IIS6 which was needed to be done on Friday.

Natively, IIS6 does not support ASP.NET MVC. In order to allow ASP.NET MVC to be enabled on IIS6, essentially you need to check the configuration mappings to have the .mvc extension inside the extension list.

You can check this by right clicking the specific application within the folder Web Sites.

- Go to Home Directory Tab

- Click on Configuration button

- There you see the list od Application Extensions with the extension name, executable path, and verbs that are supported.

- If you do not see .mvc in the extension column, you can add this by clicking the Add button.

- Inside the Add/Edit Application Extension Mapping window.

- On Executable, type in C:\WINDOWS\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll

- On Extension, type in .mvc

- On Verbs, type in GET,HEAD,POST,DEBUG

- Click OK

Finally test that ASP.NET MVC works on the published site and it should work.

How to embed video into an ASPX page

Someone on ASP.NET forums if you can embed HTML5 videos into an ASP.NET ASPX page. 

The simple answer I gave is yes as long as IIS supports the correct file type for HTML5 videos.

See my answer below: – 

Its most probably that IIS has not been configured with the correct MIME types like OGG.

See this page for details on how to configure IIS to allow these MIME types.

On the local host you also need the MIME types are set up in your .htaccess file. You may need to add the following to enable .ogv

AddType video/ogg .ogv

Gradient not working in Safari Browser

The other day my colleague discovered that some of the gradients applied to a JQuery Mobile button were not working on the Safari Web Browser at all. After researching this, according to the official Apple Developer web page it states: –

Note: Recent drafts of the W3C proposal have simplified the syntax. This chapter describes the most recent implementation shipping in Safari. You should expect Safari’s syntax for gradients to continue to change as the W3C standard evolves. While new syntax is expected, the existing syntax—and prior syntax—should still work.

The -webkit-linear-gradient and webkit-radial-gradient properties require iOS 5.0 or later, or Safari 5.1 or later on the desktop. If you need to support earlier releases of iOS or Safari, see “Prior Syntax (-webkit-gradient).”


To fix this for my CSS styling, you just need to add the following to apply the gradients to the JQuery Mobile button like so: –

.ui-page-theme-a .ui-bar-inherit.ui-header {
background: #084596;
background-image: -webkit-linear-gradient(top, #084596, #3165CA);
background-image: -moz-linear-gradient(top, #084596, #3165CA);
background-image: -o-linear-gradient(top, #084596, #3165CA);
background-image: linear-gradient(to bottom, #084596, #3165CA);

See the first line of background-image, this should fix the problem for Safari. Never was a fan of Safari!


Get every new post delivered to your Inbox.

Join 448 other followers