Posts

Showing posts from 2007

Free Alternatives to Adobe Reader

As the years have gone by, Adobe Reader (formally Adobe Acrobat Reader) has got bigger (version 5.05 is 8.6MB and will probably still handle many PDF's OK, the latest, 8.1.1 is 22.3MB) and invariably slower with each release. Thankfully there are free alternatives, that are both a smaller download and much faster at opening PDF's. SumatraPDF (< 1MB, still in beta, open source) Foxit Reader (around 2MB download) PDF XChange Viewer (13MB, but still smaller than Adobe Reader and supports comments/annotations, filling in forms and exporting text and images) Alternatively, you could still have Adobe Reader, and use a tool that disables the plugins that slow the startup - e.g. Adobe Reader SpeedUp or PDF SpeedUp (although I haven't tested either of these).

Analyse performance of web pages with YSlow

YSlow is a plugin for Firefox developed by Yahoo that analyses your web pages and reports back on any performance issues (plus gives a grade). There is a performance report (which shows you areas which can be improved), stats (overview of what is loaded, cached/uncached, cookies and number of HTTP requests), components (page, CSS/JS,JPG etc - expiry, if gzip used, response time, ETag and file sizes) and various tools (view all CSS/JavaScript and a JSLint report). This plugin depends on Firebug .

Form Layout Using CSS

I have created a sample for laying out fields within a fieldset (so that the labels are all lined up) - I use a fieldset as they are handy for grouping related fields together. Nothing too fancy, but it can be used as a basic for something better. Works with Internet Explorer 6 and 7, Firefox 2 and Opera 9.02.

Clearing tempororary files

Being a laptop user, disk space can be an issue and temporary files can be one of the things to clear out to free up some space. There are freeware applications that enable you do do this, but you can just use what is built into Windows to do the same thing. It is run from the command line and is the command rd or rmdir , which basically means 'remove directory'. It can be used to remove directories as well as its sub directories and files, by just typing rd C:\MyFolder\ /s /q (the /s switch is to include sub directories and /q prevents the prompt to remove a directory tree). At first, I thought that running it on the temporary folders directory would remove it and somehow break windows, but it doesn't. This is because there are files within that directory that are in use, and as a result, it can't be deleted. However, all the files and sub directories that aren't locked are removed, freeing up space. I use a simple batch file that cleans up the temporary folders

Sorting Files by Name, Date, FileSize etc (C#)

It is simple to get a list of files in .NET, you simply do: string folder = "c:\\windows\\"; string[] files = Directory.GetFiles(folder); This will get all the files in C:\Windows (does not include subdirectories). However, they are sorted by name (A-Z) and there aren't any options in the GetFiles method to return them in any other order. Luckily, the results are returned as an array and they can be sorted with a custom comparer. I have created a FileComparer class that can be used to sort the files (works in both .NET 1.1 and 2.0): public class FileComparer : IComparer { public enum CompareBy { Name /* a-z */, LastWriteTime /* oldest to newest */, CreationTime /* oldest to newest */, LastAccessTime /* oldest to newest */, FileSize /* smallest first */ } // default comparison int _CompareBy = (int)CompareBy.Name; public FileComparer() { } public FileComparer(CompareBy compareBy) { _CompareBy = (int)compareBy; } int IComparer.Compare( obj

Google Code uses jQuery

Google Code is now another high profile site that uses jQuery. It is used to show Google Code Blog posts, featured projects and Google Tech Talks on the home page. It doesn't use jQuery's AJAX functionality to get the feeds though.

Select box manipulation with jQuery - new plugin: selectedValues

A new plugin has been added for getting the values of options selected in a select box. More details and download from the Select Box Manipulation project page at the jQuery site.

CssCompact: A WebHandler for shrinking CSS files (ASP.NET)

Update (20 Feb 2010) : Static regular expression, compiled (performance improvement, but will be negligible for low volume sites). See Compacting CSS on-the-fly for an HttpHandler based on this. Update (08 July 2009) : Check file extension is CSS. CssCompact is a simple WebHandler for sending smaller CSS files to the client. It simply removes linebreaks, tabs, spaces (before CSS properties) and comments. That way you can still have your commented CSS code, and also save bandwidth. Use is simple, just pass on the stylesheet as a parameter when loading your stylesheet: Add to <head> : <link rel="stylesheet" type="text/css" href="/style/CssCompact.ashx?stylesheet=/style/style.css" /> or <style type="text/css"> @import "/style/CssCompact.ashx?stylesheet=/style/style.css"; </style> Create CssCompact.ashx : <%@ WebHandler Language="C#" Class="CssCompact" %> using System; using Syste

Post update - Windows Scripting: Adding/removing network printers and drives

Windows Scripting: Adding/removing network printers and drives has been updated to show you how to add entries to the event log in case of an error, rather than show a message box.

The JavaScript CompressorRater

The JavaScript CompressorRater compares several popular tools used for compressing JavaScript. At the moment, it compares JSMin , Dojo shrinksafe , Packer and the YUI Compressor (which has been recently been released and has very good results so far). Dojo shrinksafe and YUI Compressor require Java and Rhino installing. Packer can be run online and JSMin is a command line tool (with code available in several languages for use within your own applications). Before using any of these tools, it is best to check your syntax is correct (adding the optional semi-colons and checking the code with JSLint ). You can see the results of the compression with several popular JavaScript libraries: jQuery , Prototype , YUI and Scriptaculous . Mootools and Dojo are missing from the comparison. Rather than using one tool to compress your code, it may be better to try several and use the one that gives you the best results.

New Version of jQuery - 1.1.4

A new version (1.1.4) of jQuery has been released - jQuery 1.1.4: Faster, More Tests, Ready for 1.2 . There are several notable features in this release: Any name jQuery - so you can use multiple versions of jQuery on the same page (though I wouldn't recommend that if at all possible) - e.g. myobj.jQuery = jQuery.noConflict(true) It is also faster (yet again) - although it is only slow if you call the same query a lot (hundreds) of times (e.g. $("#myel").foo(); $("#myel").bar(); ... instead of $myel = $("#myid"); $myel.foo(); $myel.bar(); ... New features: .slice() (works like the JavaScript array method slice ), :has() (select element only if it has (an)other element(s) in it), recursive .extend() and .noConflict(true) (see first point) Deprecated methods are also detailed in the blog post - i.e. they won't be in jQuery 1.2, with one exception, XPath attribute selector (deprecated in 1.1.4 and 1.2 - $("div[@attr]") )

jQuery Cheat Sheet (Excel and Google Spreadsheet)

A cheat sheet for jQuery has recently been created by Matt Kruse and posted on the jQuery discussion list. It is available in Excel format via jQuery Tips (JavaScript Toolbox) or in Google Spreadsheet format (the Excel sheet created by Matt was converted into this format by George Blouin). Being in a spreadsheet format means it is easily editable, to add your own 'cheats'.

Select box manipulation with jQuery - update to removeOption

The previous update to this collection of plugins introduced a cache when adding options (i.e. made it much faster if adding a lot of options). However, it was not cleared when remove options (causing possible conflicts). This is now done and an extra parameter has been added to removeOption (of boolean type), that when set to true, will only remove options if it matches any option(s) defined by the first parameter. More details and download from the Select Box Manipulation project page at the jQuery site. A demo is also available.

FileHelpers - a library for worked with CSV files (.NET)

Best described in the words on the FileHelpers website : The FileHelpers are a free and easy to use .NET library to import/export data from fixed length or delimited records in files, strings or streams. It is a library that can be used to work with flat text files (e.g. Comma Separated Value (CSV) or Tab Separated Values (TSV) etc). Available for commercial and non-commercial use (under the LGPL). They also have a blog . There is also a CSV parser on CodeProject if you can't use a library licensed under the LGPL: A Fast CSV Reader . Not as powerful as FileHelpers but still good nonetheless.

Text Clips for Programmers Notepad 2 (jQuery)

I have not updated my jQuery Text Clips for Programmer's Notepad 2 for a while (since 1.0.2) so have added them for jQuery 1.1.2 @ Text Clips for Programmer's Notepad 2 (generated using the jQuery Text Clip Generator ).

Sending emails with C#

I'm sure many may already know how to do this, but for those that don't, sending an email using .NET is very easy and can be used in ASP.NET as well as Windows Forms or Console applications (assuming you have CDOSYS installed). This example also shows how to send an email to multiple recipients (requires you to import the namespace System.Collections ). .NET 1.0 / 1.1 (import the namespace System.Web.Mail ) MailMessage m; SmtpMail.SmtpServer = "smtpservername"; ArrayList recipients = new ArrayList(); recipients.Add("fred@bloggs.com"); recipients.Add("jane@doe.com"); for (int i = 0;i < recipients.Count;i++) { m = new MailMessage(); m.To = recipients[i].ToString(); m.From = "me@mysite.com"; m.BodyFormat = MailFormat.Html; m.Subject = "Subject of the email"; m.Body = String.Format( "<p style='font: 12px Arial'>Sending email to {0}</p>", recipients[i] ); SmtpMail.Send(m); } .NET 2.0+

Windows Scripting: Adding/removing network printers and drives

While I normally make posts related to web development, I may occasionally post something that isn't used in web development, but still has some kind of relationship (normally the underlying technology used) - for example: VBScript - Set Homepage (MSIE) / Add Notepad to Send To . In this case, it is VB Scripting and is an example of how to perform several common tasks (related to printers and drives) that network/server administrators may want to do, through a simple script (could be via login script, or executed directly on the client) rather than using the Windows GUI. It also demonstrates how to do basic error handling. Just take the following code (tweak as needed) and paste it in a script file (e.g. login.vbs). Only been tested in Windows XP (for Windows 98, you have to also define the driver name as a second parameter for AddWindowsPrinterConnection , it should work as is in Windows 2000). Option Explicit Dim WSHNetwork Dim WSHShell On Error Resume Next Set WSHNetwork = C

Link: HTML Entity Character Lookup

HTML Entity Character Lookup is a useful web based tool for looking up HTML entities codes for characters that you have an idea what they look like (e.g. a 'c'), but not sure what the entity code (e.g &copy; for ©) to use is.

Controlling browser scrollbars

In Firefox, the vertical scrollbar only shows when the page contents do not go beyond the height of the browser window (i.e. you just have a simple 'Hello World' or very little content on your page). On the other hand, the scrollbar always shows if you are using Internet Explorer. For consistency across these (and possibly other browsers as well), you can apply a little bit of CSS. To make IE behave like Firefox (only show scrollbar when needed), just do this: html { overflow-y: auto; } To always show the scrollbar (to prevent the layout changing when more content-rich pages are loaded on your site): html { overflow-y: scroll; } I also use the same trick to only show scrollbars in <textarea> 's when needed: textarea { overflow: auto; }

jQuery Plugin: focus fields

focus fields is a plugin for jQuery that adds an outline and background colour to a text input when it is given focus.

jQuery Plugin update: newsticker

I've updated my news ticker plugin to fix a few bugs. Also included on the page are some examples of adding content dynamically and applying it to the added content.

jQuery Plugin update: jQIR (jQuery Image Replacement)

jQIR (jQuery Image Replacement ) has been updated to take into account hyperlinks (i.e. it wraps the image with them). You can also run a function when the image has loaded.

Select box manipulation with jQuery - update and new plugin

In my plugins for working with select boxes , ajaxAddOption can now call a function after the options have been added. There is also a new plugin (containsOption) for checking if an option with a given value exists.

Iframes and jQuery - Working with an iframe's parent

As I stated in my last post about iframe's and jQuery , the load event was only fired once in Internet Explorer, so this may be a problem in some situations (for instance, when you go to a new page in the iframe (which is the only reason I can think of for using one instead of includes)). You can put the code into the iframe and work with the page that contains it instead. This actually may be more desirable as it is simpler and works in more browsers (Firefox, Internet Explorer, Opera 8.54+ tested) $( function() { var p = parent; $("a").click( function() { p.$("#myinput").val("Anchor clicked: " + this.href); return false; }) })

Iframes and jQuery - Working with an embedded iframe

IFrames, while they can be bad for accessibility (i.e. bookmarking), can also be very handy. What I found was that working with iframes proved troublesome. I initially thought it would be as simple as this: JavaScript $( function() { $("#myiframe").load( function(){ alert("Number of anchors: " + this.$("a").size()); alert("Document title: " + this.document.title); }); }); HTML <iframe src="myiframe.html" id="myiframe" name="myiframe"></iframe> However, this caused several errors: this.document has no properties (i.e. this.document is undefined ) and this.$ is not a function , so I had to find another way. After some trial and error in Internet Explorer and Firebug in Firefox, I found a way (which also works in Opera 9 as well, unsure about Safari though). $( function() { var myiframe = $($.browser.msie ? frames["myiframe"] : "#myiframe"); // doesn't work in Oper

Registry-less Programmer's Notepad 2

Programmer's Notepad 2 can be made to run without using the registry (i.e. make it portable, so you can use it on a removable hard drive / pen drive), but only with a development build. All it needs is a config.xml in its directory containing the following: <config> <userSettings path="settings" /> <storeType value="Xml" /> </config> Alternatively, this batch file can be used to create the file and copy over your settings. Create a batch file e.g. pn2local.cmd and paste in the following code: @echo off if exist config.xml goto copysettings echo ^<config^> > config.xml echo ^<userSettings path="settings" ^/^> >> config.xml echo ^<storeType value="Xml" ^/^> >> config.xml echo ^<^/config^> >> config.xml :copysettings md settings xcopy "%AppData%\Echo Software\PN2\*.*" settings\ /D /Q

Remove multiple options with removeOption

removeOption, a plugin available along with my other select box manipulation ones can now take a regular expression as the parameter. This can be used to remove more than one option in one go (or even all of them).

Select box manipulation with jQuery

If you read the jQuery mailing list , you may be aware that I have updated my plugins for working with select boxes . Summary of changes: addOption replaces any options with the same value (so think of it as an add/replace options plugin selectOptions selected options in addition to what was already selected, but there is now an option for it not to do this There are two new methods: copyOptions which is for copying options between select boxes ajaxAddOption allows you to add options via AJAX (i.e. could be used for create options dynamically from a server script)

Adding a WebControl before or after another one (ASP.NET C#)

ASP.NET does not directly allow you to add a WebControl after another one (i.e. you can't do MyRepeater.AddAfter(MyLiteral) to add MyLiteral after MyRepeater . These two simple functions allow you to do just that: public void AddControlBefore(Control beforeControl, Control controlToAdd) { Control container = beforeControl.NamingContainer as Control; container.Controls.AddAt(container.Controls.IndexOf(beforeControl), controlToAdd); } public void AddControlAfter(Control afterControl, Control controlToAdd) { Control container = afterControl.NamingContainer as Control; container.Controls.AddAt(container.Controls.IndexOf(afterControl) + 1, controlToAdd); }

jQIR - jQuery Image Replacement (updated)

Get jQIR to replace contents of tags (e.g. headings) with images. Can now use class as well as id.

Firebug 1.0

If you are a web developer and use Firefox, you are likely to have heard of Firebug. The final version of Firebug 1.0 is out, and offers a lot more than the previous version (0.4.1). So I would suggest you to Get Firebug if you haven't already. It is great for debugging as you can edit/inspect HTML and CSS on the live page and set breakpoints in JavaScript. If only Internet Explorer had something like this (I am aware of the Microsoft Script Editor (comes with Office and is activated within Word/Excel etc by pressing Alt+Shift+F11) and Visual Studio, but they are external applications and don't allow debugging while in the browser). Firebug is even handy for non-developers (if they are interested in moving into development) as you can see the scripts and CSS pages are using, as well as see what files are being downloaded by the browser (including those downloaded by Flash).

Getting jQuery Version

There is a way of getting the jQuery version, but it is not through using jQuery.version as you may expect. alert("jQuery version is: " + jQuery().jquery); Here is a basic function that can be used to grab more valuable information from this. function jQueryVersion() { var ver = (new jQuery()).jquery; // if there are two .'s it is a bug fix release if(ver.match(/\./g).length == 2) { return { "version" : ver, "major" : ver.substr(0, ver.indexOf(".")), "minor" : ver.substr(ver.indexOf(".") + 1, ver.lastIndexOf(".") - ver.indexOf(".") - 1), "revision" : ver.substr(ver.lastIndexOf(".") + 1) } } // otherwise it is an initial release else { return { "version" : ver, "major" : ver.substr(0, ver.indexOf(".")), "minor" : ver.substr(ver.indexOf(".") + 1), "revision" : 0 } } } This could b

Link: Sites Using jQuery

Several high profile sites use jQuery. The jQuery Wiki has a page listing those sites: Sites Using jQuery

Checkbox manipulation with jQuery

Updated my plugins for working with checkboxes http://www.texotela.co.uk/code/jquery/checkboxes/ Toggle, check, uncheck and make them behave like radio buttons. Works with jQuery 1.0 and 1.1. You supply the container, and optionally return the check items (if using toggleCheckboxes or checkCheckboxes) or unchecked items (unCheckCheckBoxes): $("#mycontainer").toggleCheckboxes().doSomethingWithMyContainer(); $("#mycontainer").toggleCheckboxes("[@name=foo]", true).doSomethingWithCheckedBoxes(); For turning a checkbox group --> radio style selection: $.radioCheckboxGroup("fieldname")

jQuery Documentation

Update 24 Feb 2007 : Link to Sean O's jQueryHelp Update 23 Feb 2007 : Added links for PDF's of API Update 29 Jan 2007 : Jƶrn Zaefferer's API browser is no longer a draft. Link below. 22:10 it also is printer friendly and can be downloaded for offline viewing. Visual jQuery 1.1.1 is also now available (and can also be downloaded). Update 18 Jan 2007 : A PDF Version of the documentation is available. To download, go to JQuery documentation in PDF . Only for the latest version of jQuery (1.1), although those with experience with Java will probably be able to check out an older version to generate the documentation. If you are a user of jQuery, it is likely that you are aware of Visual jQuery, which is an alternative reference for the jQuery API. What you may not know, is that on the site is documentation for other versions as well (so if you still use an older 1.0.x version, you can still see it on the site). Here are the links (that I know of) to the documentation of the

Associative Arrays in JavaScript

Some developers misuse the Array constructor to create an associative array. However, this is not a good way of doing this as all the methods/properties available to an array (length, index, sort etc) will not work. var foo = []; // [] is the same as 'new Array()' foo["bar"] = "baz"; alert(foo.length); When the alert fires, it will return '0' instead of '1'. As it doesn't function as a proper array, you may as well use an object instead: var foo = {}; // {} is the same as 'new Object()' foo["bar"] = "baz"; However, you can't see how many items there are without looping through the object. I have written a simple class that can be used that offers this (through the function 'getSize()' as well as a few other methods). As a result, you can't have anything with the keys 'getSize', 'remove', 'toString' and 'toArray'. var AssociativeArray = function() { if(argu

Link: Code Snippets

Code Snippets is a public source code repository where you can add your own and share them as well as browse existing ones by tags. Unfortunately it lacks search facilities or a way of navigating by multiple tags (i.e. you can not find snippets with the tag 'array' and 'javascript').