Well.. so much for javascript..

I have always despised javascript and html for it's hacky approach to...well.. everything. Html was well done in the 90's, maybe, but at the moment html and javascript just look and feel and appear to work like one huge cobbled together kludge that nobody can fix because the entire world uses html/javascript and sorta knows how it all fits together. Years ago when I was the webmaster for a small college, I dealt with javascript/html extensively and hated it intensely (back in the age of ie3 and Netscape and just the beginnings of mozilla 1.0).

So after my latest little adventure in javascript and getting everything to work perfectly in FF3, my girlfriend, who does QA for another web company, asked 'Does it work in Internet Explorer?' So I tried my simple little <input> hider (along with all the concessions I made for I.E) in I.E 8. I was expecting that there might be some small issues that would popup, but nothing major. Instead what I got was I.E 8 completely freezing to the point where I couldn't even kill it in the task manager. I got the Vista little spinning ring of death and in order to fix the issue, I had to get to the ctrl-alt-delete menu and hit 'logout'.

Now I know that there's lots of people out there who are experts in making javascript things in sing in both ie8 and ff3, but at what cost? I work at a company who primarily works with flash and there's always a big discussion/name-calling-fest whenever a site is made entirely in flash when it 'should' be made in html/javascript. The main reason people usually defend the decision to use flash is something along the lines of "we have lots of very good flash developers and it's faster for them to just develop the site in flash", which is true. The 'it works properly in all browsers with a minimum of fuss' is rarely even brought up.

But given the amount of design considerations, QA, potental major headaches that have to be taken into account when developing an html/javascript site, I would have to say that these issues are very significant. Developing in flash is significantly easier simply because the majority of these issues are minimized. You simply develope the app, QA it and deploy it. It works as expected in all browsers. No special considerations that need to be learned and tested, no design decisions that have to be abandoned because the feature will work in one browser, but not in another.

Flash wins.

Update: HTML 5 to control them all.

Learning Jquery and rehashing javascript..

Been learning jquery and messing around with hiding things dynamically in the django-admin...


indexOf doesn't work in IE so basically the work around is to apply it to ie's version of js..

if (!Array.indexOf) {
  Array.prototype.indexOf = function (obj, start) {
    for (var i = (start || 0); i < this.length; i++) {
      if (this[i] == obj) {
        return i;
      }
    }
  }
}

There is no string title case function so again, put one in yourself..

// (c)GPL, apv
String.noLC = new Object
({the:1, a:1, an:1, and:1, or:1, but:1, aboard:1,
 about:1, above:1, across:1, after:1, against:1,
 along:1, amid:1, among:1, around:1, as:1, at:1,
 before:1, behind:1, below:1, beneath:1, beside:1,
 besides:1, between:1, beyond:1, but:1, by:1, 'for':1,
 from:1, 'in':1, inside:1, into:1, like:1, minus:1,
 near:1, of:1, off:1, on:1, onto:1, opposite:1,
 outside:1, over:1, past:1, per:1, plus:1,
 regarding:1, since:1, than:1, through:1, to:1,
 toward:1, towards:1, under:1, underneath:1, unlike:1,
 until:1, up:1, upon:1, versus:1, via:1, 'with':1,
 within:1, without:1});

String.prototype.titleCase = function () {
var parts = this.split(' ');
if ( parts.length == 0 ) return '';

var fixed = new Array();
for ( var i in parts ) {
 var fix = '';
 if ( String.noLC[parts[i]] )
 {
   fix = parts[i].toLowerCase();
 }
 else if ( parts[i].match(/^([A-Z]\.)+$/i) )
 { // will mess up "i.e." and like
   fix = parts[i].toUpperCase();
 }
 else if ( parts[i].match(/^[^aeiouy]+$/i) )
 { // voweless words are almost always acronyms
   fix = parts[i].toUpperCase();
 }
 else
 {
   fix = parts[i].substr(0,1).toUpperCase() +
              parts[i].substr(1,parts[i].length);
 }
 fixed.push(fix);
}
fixed[0] = fixed[0].substr(0,1).toUpperCase() +
              fixed[0].substr(1,fixed[0].length);
return fixed.join(' ');
}

Javascripts objects work as associative arrays

var theStatus = new Object;
theStatus.Home = 'normal';
theStatus['Home'] //will print 'normal'

Arrays are useful as in all languages, but their function set isnt really all that complete and require some inelegant code to remove elements properly. (Mainly just

var arr = [4,5,6];
arr.splice(arr.indexOf(5), 1);

Also, to copy arrays by value, you have to use the splice() fn...

There's no elegant way to copy objects by value, so again.. add it in yourself.

Object.prototype.clone = function() {
var newObj = (this instanceof Array) ? [] : {};
for (i in this) {
 if (i == 'clone') continue;
 if (this[i] && typeof this[i] == "object") {
   newObj[i] = this[i].clone();
 } else newObj[i] = this[i]
} return newObj;
};

Jquery doesn't have a proper way to filter with regexes... so.... yeah... But even that needs to be modified since it only searches on the text() field of an object.

jQuery.extend(
 jQuery.expr[':'], {
     regex: function(a, i, m, r) {
         var r = new RegExp(m[3], 'i');
         //Add modifications here....
         return r.test(jQuery(a).text());
     }
 }
);

But a way to get around the lack of regex in some cases is to remember that you can chain [attributeFilters]..

$("input[id][name$='man']").val("only this one");

And finally(for now), you can add attributes to objects with attr.

$('#target').attr("disabled", true); 

I still don't like javascript, but jquery makes working with it a lot nicer.. sorta.