Web Development, JavaScript & CSS

Error: Failed to access IIS metabase. Hosting WCF Service in IIS

Tim Huffam — Thu, 14 May 2009 20:13:04 GMT

This error ("Failed to access IIS metabase") can occur when you try to access your WCF when you have added for hosting within IIS.

To solve this problem do this:

Reregister ASP.NET for IIS: Open an Visual Studio Command Prompt (or a regular command prompt and cd into the .Net dir - usually: C:\WINNT\Microsoft.NET\Framework\v2.0.50727) then type:
aspnet_regiis -i
When complete, from the same command prompt run: iisreset

Verify your IIS virtual/app dir is setup correctly (uses .Net 2). If you don't already have one...

To Host a WCF Service within IIS:

Develop your service in IIS (I'm not going to tell you how to do that!) and build it.
Within your computer management/MMC console (compmgmt.msc), open the Internet Information Service node and right click on the site you want to use and select New - Virtual Directory...
Enter the name you want.
Point this to the directory you created your WCF service project in (the project root dir - not the bin dir).
Complete the wizard then back in the MMC window right click on your new virtual dir and select Properties.
On the ASP.NET tab make sure uses version 2.0.50727 (or whatever your v2 is).

To test: within the MMC console - open your new virtual dir, right click on one of your services (eg MyService.svc) and select Browse.

HTH

Tim

How to fade image layers using Gimp gradient/blend tool

Tim Huffam — Tue, 10 Mar 2009 14:49:34 GMT

This post will explain how to do fading (fade out a layer) in Gimp.

Assuming you have an image open...

Add a new layer
Draw the part you want faded
Right click on the layer in the Layers panel/window and select 'Add Layer Mask', then click on Add on the Add Layer Mask dialog (making sure the default value of 'White (full opacity)' is selected).
Select the Blend/Gradient tool and set the Gradient to 'FG to GB(RGB)' .
On the layer click and drag a line where you want the gradient (fade) to start and finish. The first click is where it will be faded out and the second click is where it will start to fade.
Right click on the layer in the Layers panel/window and select 'Apply Layer Mask'.

That's it.

How to move/drag objects in Silverlight (2.0)

Tim Huffam — Wed, 05 Nov 2008 18:24:43 GMT

The following code shows you how you can make Silverlight controls/objects moveable by dragging them with the mouse.

Page.cs:

<UserControl x:Class="MovingObjs.Page"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Width="400" Height="300">

</Grid>

</Border>

</Canvas>

</UserControl>

Page.xaml.cs:

namespace MovingObjs

{

public partial class Page : UserControl

{

private bool moving = false;

private double offSetX;

private double offSetY;

public Page()

{

InitializeComponent();

}

private void brdMovable_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)

{

moving = true;

Point offset = e.GetPosition(brdMovable);

offSetX = offset.X;

offSetY = offset.Y;

}

private void brdMovable_MouseLeftButtonUp(object sender, MouseButtonEventArgs e)

{

moving = false;

}

private void brdMovable_MouseMove(object sender, MouseEventArgs e)

{

if (moving)

{

Canvas parent = (Canvas)this.brdMovable.Parent;

Point p = e.GetPosition(parent);

double x = p.X - offSetX;

double y = p.Y - offSetY;

txtBlkTest.Text = "X: " + x.ToString() + ", Y: " + y.ToString();

this.brdMovable.SetValue(Canvas.LeftProperty, x);

this.brdMovable.SetValue(Canvas.TopProperty, y);

}

Firefox 3 ignores cache control http headers - security risk for online apps!

Tim Huffam — Fri, 26 Sep 2008 20:17:40 GMT

If a user, using Firefox 3, signs out of a web site and does not close the browser, anyone else using that browser subsequently can view the content of pages loaded by the previous user (eg in an internet cafe, or any place where workstations are shared eg universities) - exposing private/confidential data.

This only affects HTTP post requests (not gets) and only Firefox version 3 - earlier versions (1.5, 2 etc), and IE, are not affected.

The main points are:

This is definately a bug: a violation of RFC 2616, section 14.9 that states "The Cache-Control general-header field is used to specify directives that MUST be obeyed by all caching mechanisms along the request/response chain".
Some companies who deem this a significant hole in their security have chosen to block requests from Firefox 3 (eg they deem it their responsibility to secure their customers private and confidential data to the best of their ability).
This bug has been registered with the Mozilla dev team, but currently (as of 26 Sept 2008) has a status of unconfirmed.

CSS Absolute positioning in Firefox and IE

Tim Huffam — Sat, 06 Sep 2008 14:57:24 GMT

A couple of notes regarding absolute positioning in FF and IE...

Specifying position values:

IE allows you to omit the unit of measurement for Left and Top. It assumes pixels eg:
obj.style.Left = 10;
However FF requires that you specify the unit of measurement eg:
obj.style.Left = "10px";

Using other elements parents to calculate your object's position:

The scenario might be you have a div that you want to position over or by another object - but that object has no position values. In this case I use parent object values.

Don't use the IE specific property parentElement (this is not supported in other browsers) eg:
obj.style.Left = otherObj.parentElement.offsetLeft + 10;
note in this example (that works in IE only) there is no unit of measurement.
Instead use the parentNode property (this works for both IE and FF) eg:
obj.style.left = (otherObj.parentNode.offsetLeft + 10) + "px";

HTH
Tim

VS2008 Javascript debugging error: The breakpoint will not currently be hit. No symbols have been loaded for this document

Tim Huffam — Mon, 18 Aug 2008 15:04:24 GMT

When trying to debug javascript using Visual Studio 2008 there a couple of things you need to do first - otherwise it (debugging) will not work and you'll get the following error when you hover over breakpoint in your javascript:

The breakpoint will not currently be hit. No symbols have been loaded for this document.

Note that this is only for debugging using IE (6) - not sure about other browsers/versions.

Within IE go into Tools - Internet Options - Advanced tab and make sure the 'Disable Script Debugging' is unchecked.
Make sure you have a breakpoint in your javascript.
Start debugging your web app in VS.
Within VS select menu item Debug - 'Attach to Process...'
On the Attach to Process dialog, select the row which has explorer.exe for your app (the Title column will have you page title on it), then click Attach.

That's it - when your breakpoint is reached the VS debugger will be triggered.

HTH
Tim

Centering div tags using CSS

Tim Huffam — Tue, 15 May 2007 22:11:00 GMT

As text-align doesn't work I use a simple work around:

.mydiv{
width: 100%;
left: 50%;
}

It's not perfect - but very simple and easy to understand - and you can modify it to suit.

Seems to work ok in IE 6 & FF 2.0.

Here's another method (http://www.andybudd.com/archives/2004/02/css_crib_sheet_3_centering_a_div/index.php) - but I found it not obvious/simple enough (expecially for others who may have to maintain the css down the track - KISS)

HTH
Tim

Printing nicely from the web: Printing web pages or alternate documents

Tim Huffam — Tue, 31 Oct 2006 17:30:00 GMT

Many web pages are not designed with any consideration for printing - this is one of those annoying things that one comes across more often than not.

Here are a couple of simple ways to make sure your pages are printed in a formatted way:

Use a specific print style sheet.

This is the most common approach used on the web. The idea being you create another stylesheet that is specifically for formatting your web page(s) for printer output.

There are many examples on the web of how to do CSS so I won't go into that. However what you may need to know, is how to specify an printer specific stylesheet within your page.

A normal stylesheet is added like this:
<link href="default.css" type="text/css" rel="stylesheet">

where as a print specific stylesheet is added like this:
<link href="print.css" type="text/css" rel="stylesheet" media="print">

By adding this to your web page, whenever the user click on the Print button the page will be formated using the print stylesheet.
Use an alternative document.

This is a less known method, which can be very effective. Basically it tells your browser to use an alternative document whenever the user clicks on Print. This alternative document can be any web resource eg another web page or something like a word document, spreadsheet or pdf document. What's good about this that things like word or pdf documents are very quick and easy to create and format - so you know what it's going to look like printed right away (I find it way easier to create and format a word doc than fiddling with stylesheets).

This is how to specify the alternate print document:

<link href="worddoc.doc" type="application/msword" rel="alternate" media="print">

Note that you should specify the correct content type.

HTH

Tim

Access is denied - Javascript error when attempting to load xml from an external site.

Tim Huffam — Wed, 17 May 2006 13:13:00 GMT

As yet I don't have the answer to this problem - so any suggestions would be very much appreciated!

I have a JS library with an object that loads xml from a specified URL and populates specified HTML elements with the data. This works fine.

However recently I refactored the code that calls this library, to be more OO (to allow it to be more easily extended). Now the xml "load()" method raises the error "Access is denied" when loading from external urls.

I've proved that the load library still works ok by calling it from a simple test script.

So why does the behavior of a JS function change based on what has called it?

Any help will be very much appreciated!
Thanks in advance
Tim

DOM Inspector not working in FF (FireFox)

Tim Huffam — Fri, 12 May 2006 00:40:00 GMT

When you install Firefox on windows, by default it does not install the DOM Inspector.

To make sure it installs it, select Custom Install then select Web Developer Tools.

If you already have FF installed you can install the DOM Inspector without having to reinstall FF:

Run the FF installer - just so it unpacks the install without installing anything.
Use file explorer to locate the C:\Documents and Settings\<username>\Local Settings\Temp dir. FF will have created a temp directory to unpacked the install components into (in my case "7zS17.tmp").
Start FF.
Drag adt.xpi onto the FF window. This installs the dom inspector.
Cancel the install.
Restart FF.

Thanks very much to clagnut for his informative post on this - and to Thierry B for his additional help on this.

Update for Firefox 2.0: (25 Oct 06)

Same problem exists - whereby it did not install the DOM Inspector by default. However the solution mentioned above does not appear to work (as I couldn't find the adt.xpi file) - so there is another work around - for which I've created another post (for feed subscribers).

HTH

Tim