PDA

View Full Version : [CLOSED] Coolite.axd throwing errors for icon css



jchau
Oct 15, 2008, 8:13 PM
I defined my own css file for displaying coolite icon, but Coolite.axd is throwing exceptions when it tries to load the icon.



.icon-newreport { background-image: url(../icons/add-png/coolite.axd) !important;}


The css file is located under a folder in the root. Using fiddler, I see it is trying to hit

http://m52f/mustache/icons/delete-png/coolite.axd

which is correct. The weird thing is that this only affects SOME icons but not all. If I change the icon from add-png to disk-png, it works fine. Here's the exception that's being thrown:


System.NullReferenceException: Object reference not set to an instance of an
object. at Coolite.Ext.Web.ResourceManager.ProcessRequest(Htt pContext context)
at
System.Web.HttpApplication.CallHandlerExecutionSte p.System.Web.HttpApplication.IExecutionStep.Execut e()
at System.Web.HttpApplication.ExecuteStep(IExecutionS tep step, Boolean&
completedSynchronously)

geoffrey.mcgill
Oct 16, 2008, 2:22 AM
Hi jchau,

With the embedded Icons, you need to include the full path to the root of the Application. Given your code sample I would suspect the name "mustache" is your Application name. I think the following revised code sample should work.



.icon-newreport { background-image: url(/mustache/icons/delete-png/coolite.axd) !important;}


But... as a general rule I would recommend only using the embedded resources programtically. While hard linking to the files is certainly possible, the odds of something changing (and not working) after you deploy is increased. 


For the Icons there are several helper Methods available from the <ext:ScriptManager>.


1. RegisterIcon - Creates and adds the css class into the <head> of your &#100;ocument. Try adding the following line to your Page_Load event, then view the Html source rendered to the browser (View > Source). You should see a new .icon-delete css class and the correct url path will be defined. That path is the one you should be using in your original code sample.



this.ScriptManager1.RegisterIcon(Icon.Delete);


2. GetIconUrl - Gets the url to the embedded resource Icon. The url is affected by the <ext:ScriptManager> .CleanResourceUrl property. If CleanResourceUrl="false", then the url path returned by GetIconUrl will be the typical ugly autogenerated WebResource.axd path. 



this.ScriptManager1.GetIconUrl(Icon.Delete);


3. GetIconClass - Gets the full css class specification for the Icon. 



this.ScriptManager1.GetIconClass(Icon.Delete);


If you have copied the "Coolite - Drag into your Project [not required]", then please just direct link to those files. If your icon url has the "/coolite.axd" extension, then you are linking to the icon .png file stored within the .dll, which is different than "/Coolite/" folder which you may have dragged into your project. 


Hope this helps.

jchau
Oct 16, 2008, 10:17 AM
Thanks Geoffrey. Mustache is the website code name so I do not want to hardcode that into the css file. We name the website differently for testing vs production. I will try the RegisterIcon method. Any thoughts of automatically creating an external file for the css icons instead of writing them to the html so it can take advantage of browser caching? I may have 20 icons on the page and the html looks cleaner without those css classes defined in the head.

geoffrey.mcgill
Oct 16, 2008, 10:25 AM
Any thoughts of automatically creating an external file for the css icons instead of writing them to the html so it can take advantage of browser caching?

Yes, add the image files to your project/website and within your css just link to them as you typically would any other image.