Shaun Mccran

My digital playground

11
M
A
R
2010

JavaScript Library conflicts when using more than one at the same time

Whilst building a new piece of functionality I have been trying to combine a JQuery carousel plug-in and the lightview prototype plug-in. This threw up an unexpected issue. Both libraries map the dollar ($) as their shortcut indicator. JQuery uses "$" as a shortcut as a replacement for "jQuery" and Prototype uses "$" as well.

It turns out that there is a JQuery command for exactly this issue. Wherever you include the JQuery library reference add another script code. The noConflict function maps which character you tell it as the short name for "JQuery".

view plain print about
1<s/cript src="http://www.google.com/jsapi" type="text/javascript"></script>
2<s/cript type="text/javascript" charset="utf-8">
3    google.load("jquery", "1.3");
4</script>
5
6<s/cript>
7    jQuery.noConflict();
8    var J = jQuery;
9</script>

Just remember to change your references to JQuery from "$" to "J", or whatever you assign it to.

view plain print about
1J(document).ready(function(){
2code
3});

Now both the Libraries can load into different namespaces.

28
F
E
B
2010

My Software Development platform specifications - whats yours?

I've been experiencing issues with my development setup, so I thought I'd write a blog entry to wrap up my findings, and try and gauge what the community is running. In this article I will detail what I use in my development environment, and how it is set up.

I've recently had errors occurring in my Eclipse IDE. There have been some very frustrating SVN client version incompatibilities, so I thought I would re install it. It turns out this was a common error (menu options in subclipse were not available) based on an incompatibility between the subclipse plug-in and the Aptana studio.

A detailed fix is in this blog entry: https://radrails.tenderapp.com/discussions/problems/173-synchronize-view-broken-after-upgrading-to-radrails-203

Software setup

I use the Eclipse Java IDE as my primary development application. Alongside this I use the CFEclipse plug-in for ColdFusion functionality, the Aptana Studio plug-in for CSS and JavaScript functionality. I also use the subclipse plug-in for SVN integration.

For Flex/AIR I use a standalone FLEX studio installation. This is pretty much a custom workspace in an Eclipse IDE. I only do this as I have had several issues trying to get FLEX installed into the regular Eclipse IDE.

I recently tried to switch to the 64 bit version of Eclipse, but it would not recognise my Java install, and from what I've read online you need to install a 64 bit version of Java. The only version of this I can find is flagged as "experimental" so I think I'll leave it well alone.

I've found it quite good to increase the default 256mb heap space in Eclipse to 512mb, there e is an article detailing how to edit the Eclipse ini file here: http://wiki.eclipse.org/FAQ_How_do_I_increase_the_heap_size_available_to_Eclipse%3F

Download links

Eclipse downloads: http://www.eclipse.org/downloads/

CFEclipse downloads: http://trac.cfeclipse.org/wiki/InstallingCfeclipse

Aptana downloads: http://www.aptana.org/studio/plugin

Subclipse downloads: http://subclipse.tigris.org/servlets/ProjectProcess?pageID=p4wYuA

28
J
A
N
2010

Passing url variables through Isapi re write - Regular Expression

One of the more common tasks in ColdFusion development is passing variables through the URL string. We are all familiar with the idea that the question mark (?) denotes the url query string start, and that name value pairs are separated with the ampersand (&).

I usually avoid using this in display templates, as it isn't great exposing your internal site workings to customers, and with Fusebox it is very easy to pass the URL variables to an "act_" template and remain hidden.

What happens when you want to use dynamic url variables with a URL re writing application like Isapi re write? I've been using Isapi re write in some FuseBox framework application, and it is relatively easy to set up a rewrite rule, as shown below.

view plain print about
1RewriteRule home(/) index.cfm?fuseaction=circuitname.circuitfunction

Where the url /home/ would actually serve up the content specified in the fuse specified. But this is hard coded. What about dynamic variables?

We can create a regular expression to handle the translation of the variables.

view plain print about
1RewriteRule destination/(.*)/(.*)/ index.cfm?go=circuitname.circuitfunction&$1=$2

We use a similar URL, but append the dollar ($) 1 = dollar ($) 2 string. In the re write rule we specify that appended variables are transposed into the string using the slash (/) as a separator.

So as an example we could pass a product id of 24 into the rule like this:

view plain print about
1www.siteurl.com/cart/productId/24/
2RewriteRule buy/(.*)/(.*)/ index.cfm?go=cart.buy&$1=$2

It would be rewritten to the more familiar url string. A handy way of continuing to mask the url.

22
J
A
N
2010

Strict or Transitional DTD type validation, worth hacking just to pass?

An area of web development that I previously had little exposure to was WCAG validation. This is the industry standard for Accessibility coding for web platforms. For version two (V2) of the WCAG there are three standards, A, AA and triple A (AAA). Each represents different levels of Accessible compatibility.

What this also does is validate against the W3C doctype standards. This is where my problems arose. The main aim of the doctype standard is to clearly define a separation layer between content and behaviour. In practical terms this equates to best practices such as having an external .CSS files rather than inline styling, and declaring the language types for scripting, such as JavaScript etc.

Using a free online tool, http://www.totalvalidator.com/ you can check if your site is W3C and WCAG complaint. It will base the validation on the doctype declared in your html. There are three types of DTD declaration for html 4.01.

view plain print about
1<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
2
3<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
4
5<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/frameset.dtd">

You can read more about Doctypes here: http://www.w3schools.com/tags/tag_DOCTYPE.asp

The main difference between these is that the frameset DTD will accept frameset as valid html, whereas the others will not. Also the Strict DTD imposes a very tight restriction of what is accepted as valid in comparison to the Transitional DTD. One is a Strict adherance to the standard, whereas the other shows that you are Transitioning from old code into the new.

The site http://24ways.org/2005/transitional-vs-strict-markup goes into more detail about what the exact differences are, what I am going to discuss is the option of creating functional hacks, merely to pass validation.

One of the deprecated attributes in Strict validation is the target attribute.

view plain print about
1<a href=http://www.mywebsite.com target=_blank>Follow this link to go to my website</a>

We are all familiar with this attribute, but when you examine it you find that it is actually a declaration of behaviour. We are forcing the user into a specific action. IE open a new window. As a best practice guideline whenever we have a link on a site that exits that site, we open a new window. The only work around for this is creating a specific JavaScript function to open a new window, as this will not be marked as invalid. This seems overkill, just to pass validation.

So I am left with the dilemma that if I want my sites to pass Strict DTD validation I must create a JavaScript hack, or compromise the functionality. I'd like to pass the validation, but I view the functionality as key to a site, so it's an easy decision for me.

_UNKNOWNTRANSLATION_ /