CSS Variables

• Download source files - 18 Kb

Introduction

body
{
   background-color:#BG_COLOR#
}

Generic HTTPHandler

Using Visual Studio 2005 you can easily add a Generic HTTPHandler.

This will create an ashx file and add it to you project. This file implements the IHTTPHandler interface, with its one and only method, ProcessRequest and includes the WebHandler page directive.

<%@ WebHandler Language="C#" Class="Handler" %>

<%@ WebHandler Language="C#" Class="CSSHandler" %>

using System;
using System.Web;
using System.Configuration;

public class CSSHandler : IHttpHandler 
{
    public void ProcessRequest (HttpContext context) 
    {
        context.Response.ContentType = "text/css";
        
        // Get the file from the query stirng

        string File = context.Request.QueryString["file"];
        
        // Find the actual path

        string Path = context.Server.MapPath(File);
        
        //Limit to only css files

        if(System.IO.Path.GetExtension(Path) != ".css")
           context.Response.End();

        //Make sure file exists

        if(!System.IO.File.Exists(Path))
           context.Response.End();

        // Open the file, read the contents and replace the variables

        using( System.IO.StreamReader css = new System.IO.StreamReader(Path) )
        {
            string CSS = css.ReadToEnd();
            CSS = CSS.Replace("#BG_COLOR#", ConfigurationManager.AppSettings["BGColor"]);
            context.Response.Write(CSS);
        }
    }
    
    public bool IsReusable 
    {
        get { return false; }
    }
}

As we can see the ProcessRequest method simply opens the file specified on the query string, reads it and using string replace to add the value for the variable that has been specified in the web.config file. Not much to it.

<link rel="Stylesheet" href="CSSHandler.ashx?file=default.css" />

<appSettings>

    <add key="BGColor" value="Red"/>

</appSettings>

<httpHandlers>
    <add verb="*" path="*.css" type="CustomHandler.CSSHandler, CustomHandler"/>
</httpHandlers>

public class CSSHandler : IHttpHandler 
{
#region IHttpHandler Members

    public bool IsReusable
    {
        get { return false; }
    }

    public void ProcessRequest(System.Web.HttpContext context)
    {
        // Get the physical path of the file being processed

        string File = context.Request.PhysicalPath;

        // Open the file, read the contents and replace the variables

        using(System.IO.StreamReader reader = new System.IO.StreamReader(File))
        {
            string CSS = reader.ReadToEnd();
            CSS = CSS.Replace("#BG_COLOR#", ConfigurationManager.AppSettings["BGColor"]);
            context.Response.Write(CSS);
        }
    }

    #endregion
}

The only difference from the previous example is that the CSS file to parse is obtained from the context.Request.PhysicalPath property. Since the handler is registered for css files it will process any stylesheet file regardless of its location in the web project.

Conclusion

This article has hopefully shown a method that can be used to provide dynamic settings to an otherwise static file and give website uses a more positive experience.