Ten Tonne Baby!

Where's Mama?

Recent Posts

• CSS specificity for deprecated HTML attributes

  Today I had to plug a slightly strange gap in my knowledge – how old school HTML attributes apply to the CSS specificity resolution for conflicts. An example would be the border attribute specified both as an attribute on a table element, and with an element selector in a stylesheet.

  It looks like old school html attributes to control presentation are treated as the lowest of the low – so a duplicate instruction within any kind of CSS selector will be treated as more specific and win.

  I had at first assumed they would be treated with the same specificity as inline styles, but not so.

  Now you can sleep at night.

  Posted:

  November 23, 2009 @ 16:40

  Categories:

  Development

  Tags:

  css

  Comments:

  No comments so far

• Problems using Typekit with Photoshop design work

  There’s been a lot of discussion recently around progress getting font foundries to adopt a suitable licensing model for web distribution of font files, providing a way to render live text in a range of fonts. I’ve been playing around a little with Typekit with the intention of using this on a site I’m designing at the moment.

  The main issue that I’ve hit is that Typekit is geared around web licensing and delivery of font files – so a subscription will give you access to a wide range of fonts that can then be downloaded from your site and used to render text. However the earlier stage in the workflow is working on page designs in Photoshop, and a Typekit subscription won’t give you any access or rights around downloading a font definition file to use for design work.

  This means that theoretically I have much more freedom around typography, but only when I come to the build stage of the site. I wouldn’t necessarily mind paying for a font separately from the Typekit subscription, but I can’t actually find the same font I would like to use on the foundry site (admittedly this may just be my own stupidity).

  I think this is just a teething issue with a new service – it’s being discussed on the support forum…

  • Send a font list/library to a designer
  • Use a font in Photoshop
  • Downloadable versions

  Posted:

  November 23, 2009 @ 10:28

  Categories:

  Design, Development

  Tags:

  Design, fonts, photoshop

  Comments:

  No comments so far

• Supporting native browser rendering of custom fonts

  I’ve just been reading an article from Jeff Veen on a font-embedding technology coming up shortly. We’re going to be in a situation soon where every major browser is about to support the ability to link to a font hosted on a web server, which is downloaded and used by the browser to render text. Although the technology is almost there, legal and copyright issues will take a lot longer to catch up. It looks like this could provide an interim solution, definately worth keeping an eye on.

  Posted:

  June 3, 2009 @ 8:33

  Categories:

  Design, Development

  Tags:

  browser, fonts, typography

  Comments:

  No comments so far

• Configuring a virtual application within an ASP.NET MVC site

  I recently had to look into how to get requests to /TestApp within an ASP.NET MVC site resolving to another application, instead of picking up the default routing rule and trying to find the Index action on a TestApp controller class. A scenario where this may occur would be setting up a wiki application to run on /wiki off your main domain name.

  First off, we need to ensure that the routing module doesn’t kick in and attempt to handle the request. This can be achieved by making the following change in global.asax of the MVC app…

  routes.IgnoreRoute("{*path}", new { path = @"TestApp\/(.*)" });

  You can then create a new virtual directory in IIS under the main site, and convert it into an application to ensure it’s running in a seperate AppPool etc.

  The final step is to ensure that web application settings in the parent application don’t cascade and get applied to the child application. This is achieved by wrapping all of the main configuration in a location block, and setting inheritInChildApplications to false like so…

  <location path="." inheritInChildApplications="false">
     <system.web>Blah</system.web>
     <system.webServer>Blah</system.webServer>
  </location>

  The most useful reading on this I could find was this forum post.

  Posted:

  June 1, 2009 @ 16:40

  Categories:

  Development

  Tags:

  .NET, asp.net, iis, mvc

  Comments:

  No comments so far

• Team Explorer 2008 timeout and COM exception after installing October TFS PowerTools

  I had been experiencing massive delays after connecting to a TFS server in Team Explorer 2008. These usually ended up with a COM exception – Creating an instance of the COM component with CLSID {B69003B3-C55E-4B48-836C-BC5946FC3B28} from the IClassFactory failed due to the following error:80004005.

  This turned out to be a problem with the October release of the TFS PowerTools. I found the solution here which was based on disabling the new ‘Collaboration’ feature that was added to Team Explorer.

  Posted:

  March 31, 2009 @ 15:54

  Categories:

  Development

  Tags:

  team explorer, tfs, visual studio

  Comments:

  No comments so far

• Unable to fade text in Flash player 9

  I was looking into a bizarre problem recently in Flash where I couldn’t get the simplest thing to work – fading text. I tried everything I could think of – motion tweens, classic tweens, changing the Alpha effect, changing the alpha channel in the text colour.

  The weird thing was that targetting Flash 10 in the publishing settings meant the animation worked fine, but switching to flash 9 caused it to stop working.

  It turns out that in order to animate the opacity of dynamic text for Flash 9, you need to explicitly specify which character glyphs to embed in the swf. Select the dynamic text element, then hit the ‘Character Embedding’ button in the properties pane.

  When I stop to think about it, this makes a lot of sense. By default I would imagine flash is using the operating system to draw the text with the specified font. This is why the font needs to exist on the end machine. However, as soon as you do things like fade opacity, I think flash must take responsibility for rendering the text. In order to do that, flash needs the vector information for drawing different characters in the font, so you have to explicitly embed that information. In order for this to work in Flash player 10, they must make some kind of default assumption that you need the vector information embedded, and do this for you.

  Posted:

  March 31, 2009 @ 15:48

  Categories:

  Development

  Tags:

  flash

  Comments:

  No comments so far

• Problems with javascript minification that affects SwfObject 2.1 in Internet Explorer

  This is actually a more general issue with javascript minification that can affect a number of scripts, but I noticed it while tracking down weird behaviour with the minified version of SwfObject that only affected Internet Explorer.

  Basically, standard behaviour with most javascript minifiers is to strip out anything contained within comments. I finally tracked down this piece of code in the swfobject library that was getting stripped out (incorrectly) by the minifier…

  /*@cc_on

  ie = true;

  @if (@_win32)

  windows = true;

  @elif (@_mac)

          mac = true;

      @end

  @*/

  This library carries out browser detection by using the proprietary Conditional Compilation feature in Internet Explorer. In order to stop other browsers from choking, the code is wrapped in a comment.

  I’m not commenting whether this is a good or bad idea, simply that it does appear in existing scripts, and causes a bunch of javascript minifiers to strip out functional code.

  I think my approach will be to revise the set of regular expressions that control what gets stripped out to cater for this variation.

  Posted:

  March 26, 2009 @ 12:01

  Categories:

  Development

  Tags:

  flash, javascript, performance

  Comments:

  No comments so far

• Problem with SWFObject 2.1 in IE7 / Vista

  I have a site where I’m using the SWFObject javascript library to handle Flash detection and embedding of flash movies. I noticed a javascript error in IE7 that was preventing the alternate content being replaced with the flash movie – the end result was a banner showing ‘get a new version of flash’ etc.

  After a little investigation the problem appears to only affect the minified version of the library. I haven’t found the exact issue, but it looks like a problem with the obfuscation applied in publishing the minified js file.

  I have a custom endpoint handling minification and caching of the javascript anyhow, so after switching to the source version of the library and handling minification myself, all is good in IE7.

  Posted:

  March 18, 2009 @ 12:03

  Categories:

  Development

  Tags:

  flash, IE7

  Comments:

  2 comments so far

• Webtrends tracking from Flash

  I’ve been working on a Flash widget, and the majority of the sites it will be hosted on use WebTrends for analytics. I recently had to look into capturing certain interaction events from the Flash movie and passing them through to WebTrends for reporting.

  Flash events are tracked as fake page impressions in WebTrends based on unique URLs that you define. The flash movie doesn’t talk to WebTrends directly – it calls through to javascript on the host page which logs the event via standard WebTrends javascript.

  In my case I’m working on a widget that could be hosted on a variety of pages that may or may not implement WebTrends. The required behaviour is for tracking to automatically kick in if the host page implements WebTrends, but gracefully degrade if not. I have a javascript file that handles interaction with the flash movie, so I can guarantee certain js functions exist on the host page.

  The solution looks like so…

  Add an ActionScript class to pass events through to host page

  package {

      import flash.external.ExternalInterface;

      public class Analytics {

          public static const WIDGET_LOADED:String = "/Video/Widget/WidgetLoaded";

          public static const PLAYER_LAUNCHED:String = "/Video/Widget/PlayerLaunched";

          public function Analytics(): void {

          }

          public static function captureEvent(eventType:String) {

              if (ExternalInterface.available) {

                  ExternalInterface.call("mycompany.video.captureAnalyticsEvent",  eventType);

              }

          }

      }

  }

  An example of passing an event to this class…

  Analytics.captureEvent(Analytics.WIDGET_LOADED);

  Implement javascript functions on the host page

  /* set up namespace for new functions */

  if (window["mycompany"] == null) {

      window["mycompany"] = {};

  }

  mycompany.video = {

      webtrendsTrackingFunction: {},

      captureAnalyticsEvent: function(eventType) {

          var uriParam = 'DCS.dcsuri';

          if (typeof (this.webtrendsTrackingFunction) == 'function') {

              // if user has nominated a specific tracking function

              this.webtrendsTrackingFunction(uriParam, eventType);

          } else if (window["dcsMultiTrack"] != null) {

              // if dcsMultiTrack already implemented on page

              window.dcsMultiTrack(uriParam, eventType);

          } else if (window["dcsTag"] != null) {

              // otherwise if webtrends implemented on page, use default implementation

              mycompany.video.analytics.dcsMultiTrack(uriParam, eventType);

          }

      }

  }

  mycompany.video.analytics = {

      dcsMultiTrack: function() {

          for (var i = 0; i < arguments.length; i++) {

              if (arguments[i].indexOf('WT.') == 0) {

                  WT[arguments[i].substring(3)] = arguments[i + 1]; i++;

              }

              if (arguments[i].indexOf('DCS.') == 0) {

                  DCS[arguments[i].substring(4)] = arguments[i + 1]; i++;

              }

              if (arguments[i].indexOf('DCSext.') == 0) {

                  DCSext[arguments[i].substring(7)] = arguments[i + 1]; i++;

              }

          }

          var dCurrent = new Date();

          DCS.dcsdat = dCurrent.getTime();

          dcsTag();

      }

  }

  The key points above the script above…

  • To report events from Flash, WebTrends require an additional function on the host page that they provide – dcsMultiTrack
  • If the host page has implemented dcsMultiTrack already, the existing function will be used
  • If the host page implements standard WT js but not the additional function, a fresh implementation of the dcsMultiTrack function will be used
  • If WebTrends javascript has not been implemented on the host page, nothing bad happens

  In addition, we have a standard function that the flash movie will always call, so if we need to extend functionality to cater for different analytics systems etc, then we have a single place to implement this.

  This is probably the least sexy post I’ve ever written, but it seemed worthwhile to document this. I’ll follow up with some sexified content sometime soon.

  Posted:

  February 27, 2009 @ 12:07

  Categories:

  Development

  Tags:

  analytics, flash, javascript, webtrends

  Comments:

  2 comments so far

• Testing IE rendering

  I have to admit until recently I’ve been using virtual machines for testing rendering in different versions of IE – just came across IETester which lets you open new tabs running the rendering engine from different versions. You probably know all about this already, but it was new to me. Last time I looked into this it was still a major headache.

  I’d really recommend taking a look if you’re doing any client-side dev work.

  Update: There isn’t a huge amount of information about exactly how this is implemented and whether you can solely rely on this for testing rendering + javascript of a major application. The closest I could find was this from the author on a forum… ‘I am hooking win32 functions to override standard calls and launch custom versions of IE instead of standard version.’ Everything I’ve tried so far has been accurate, but I think better documentation would really help adoption.

  There may be info I haven’t found in the forums.

  Posted:

  February 26, 2009 @ 13:22

  Categories:

  Development

  Tags:

  rendering, x-browser

  Comments:

  2 comments so far