Ivor O’Connor

March 9, 2013

The Universal IDE: VI with SPF13

Filed under: bash, git, howto, html5, IDE, JavaScript, Linux, mint 14 xfce, php, sqlite, ubuntu, vi, vim, vundle — ioconnor @ 4:08 am

This is a youtube video I made on how to install SPF13 on Linux Mint 14 XFCE. I like learning from youtube videos whenever possible. If in the future I want to install SPF13 and something is not how I remember it I can return to this video. SPF13 makes VI into a universal IDE. It works on most if not all OSs including windows and the mac.  Sure if you are working with something like AIX, HP-UX, or some platform that does not have vim installed SPF13 will not be for you. I’d recommend you put in your base .vimrc commands directly into the .vimrc.local file and use them along with SPF13. Picking and choosing what you find works.

UPDATE 2013-03-08: Insert the following line into your .bashrc file before starting to get full colors: export TERM=”xterm-256color”

Advertisements

February 7, 2013

vundle

Filed under: bash, css, git, html5, JavaScript, Linux, pdo, php, vim, vundle — ioconnor @ 12:36 pm

Vundle is the new package manager for vim plugins. I’m thinking it will be largely responsible for making a resurgence in the use of vim because it allows clean installs of IDE tools for various environments. Allowing easy file navigation, editing, compiling, debugging, and all the other things you might want to do. However vundle is new and largely unknown. Take a look for it in any vim book and you won’t find it. This post will be continuously updated until it has the information I find useful and need on a routine basis. My first effort will be in setting up an environment for PHP, javascript, html, css, bash, c/c++, git, pdo, and mysql/sqlite3 development. So I’m thinking there will probably be a flurry of updates to this post over the next few months.

First off auto installing vundle. I stole the following from this site but had to remove the EOL comments to make it work. Make a copy of your existing “.vimrc” and then add the following to the end of your .vimrc file:

" Setting up Vundle - the vim plugin bundler
let iCanHazVundle=1
let vundle_readme=expand('~/.vim/bundle/vundle/README.md')
if !filereadable(vundle_readme)
echo "Installing Vundle.."
echo ""
silent !mkdir -p ~/.vim/bundle
silent !git clone https://github.com/gmarik/vundle ~/.vim/bundle/vundle
let iCanHazVundle=0
endif
set rtp+=~/.vim/bundle/vundle/
call vundle#rc()
Bundle 'gmarik/vundle'
"Add your bundles here
Bundle 'Syntastic'
Bundle 'altercation/vim-colors-solarized'
Bundle 'https://github.com/tpope/vim-fugitive'
"...All your other bundles...
if iCanHazVundle == 0
echo "Installing Bundles, please ignore key map error messages"
echo ""
:BundleInstall
endif
" Setting up Vundle - the vim plugin bundler end

Then type in to vim “:BundleInstall!” and watch it install before restarting vim.

2013-02-08 UPDATE: Interesting links:

May 7, 2009

How To Install Jslint on Ubuntu

Filed under: bash, cli, debugging, howto, JavaScript, Lint, Linux, tutorial, ubuntu — Tags: , , , , , , — ioconnor @ 5:30 pm

At my entry https://ioconnor.wordpress.com/2009/04/24/javascript-testing/ you’ll notice there are two entirely different lint programs out there for JavaScript. I installed and made an entry on how to install JavaScript Lint here. This posting describes how to install the other version of lint, jslint, under ubuntu. I even tested it under Ubuntu 8.04 and 9.04. Follow these steps:

  1. sudo mkdir -p /my/bin
    I prefer not to much around in the home directory but to create all custom stuff right off the root so I know what is mine. You can choose some other directory if you’d like.
  2. cd /my/bin
  3. sudo wget http://www.jslint.com/rhino/jslint.js
    If they ever remove this send me a mssage and I’ll post it.
  4. sudo chmod a+x jslint.js
    Not sure if this is needed but it’s habit…
  5. sudo apt-get install rhino
    I did not have rhino installed on 9.04 but it does not hurt to verify with this command.
  6. time rhino jslint.js jslint.js
    jslint is written in javascript. So run it on itself to see if there are any errors or warnings.

That’s pretty simple. Too bad their website does not make it simple. In fact their website does not contain enough information. I had to google about for a while to figure it all out. Anyways here is the output when ran on itself. Then further down I use the other lint program on it.

JSLint does allow options. I am going to at some point see if I can make an include file that will specify just the options I want.

JSLint also has a good section on coding standards. I like it.

time rhino /my/bin/jslint.js /my/bin/jslint.js
Lint at line 4 character 236: eval is evil.
“use strict”;JSLINT=(function(){var adsafe_id,adsafe_may,adsafe_went,anonname,approved,atrule={‘import’:true,media:true,’font-face’:true,page:true},banned={apply:true,’arguments’:true,call:true,callee:true,caller:true,constructor:true,’eval’:true,prototype:true,unwatch:true,valueOf:true,watch:true},boolOptions={adsafe:true,bitwise:true,browser:true,cap:true,css:true,debug:true,eqeqeq:true,evil:true,forin:true,fragment:true,immed:true,laxbreak:true,newcap:true,nomen:true,on:true,onevar:true,passfail:true,plusplus:true,regexp:true,rhino:true,undef:true,safe:true,sidebar:true,strict:true,sub:true,white:true,widget:true},browser={alert:true,blur:true,clearInterval:true,clearTimeout:true,close:true,closed:true,confirm:true,console:true,Debug:true,defaultStatus:true,document:true,event:true,focus:true,frames:true,getComputedStyle:true,history:true,Image:true,length:true,location:true,moveBy:true,moveTo:true,name:true,navigator:true,onblur:true,onerror:true,onfocus:true,onload:true,onresize:true,onunload:true,open:true,opener:true,opera:true,Option:true,parent:true,print:true,prompt:true,resizeBy:true,resizeTo:true,screen:true,scroll:true,scrollBy:true,scrollTo:true,setInterval:true,setTimeout:true,status:true,top:true,XMLHttpRequest:true},cssAttributeData,cssAny,cssColorData={“aliceblue”:true,”antiquewhite”:true,”aqua”:true,”aquamarine”:true,”azure”:true,”beige”:true,”bisque”:true,”black”:true,”blanchedalmond”:true,”blue”:true,”blueviolet”:true,”brown”:true,”burlywood”:true,”cadetblue”:true,”chartreuse”:true,”chocolate”:true,”coral”:true,”cornflowerblue”:true,”cornsilk”:true,”crimson”:true,”cyan”:true,”darkblue”:true,”darkcyan”:true,”darkgoldenrod”:true,”darkgray”:true,”darkgreen”:true,”darkkhaki”:true,”darkmagenta”:true,”darkolivegreen”:true,”darkorange”:true,”darkorchid”:true,”darkred”:true,”darksalmon”:true,”darkseagreen”:true,”darkslateblue”:true,”darkslategray”:true,”darkturquoise”:true,”darkviolet”:true,”deeppink”:true,”deepskyblue”:true,”dimgray”:true,”dodgerblue”:true,”firebrick”:true,”floralwhite”:true,”forestgreen”:true,”fuchsia”:true,”gainsboro”:true,”ghostwhite”:true,”gold”:true,”goldenrod”:true,”gray”:true,”green”:true,”greenyellow”:true,”honeydew”:true,”hotpink”:true,”indianred”:true,”indigo”:true,”ivory”:true,”khaki”:true,”lavender”:true,”lavenderblush”:true,”lawngreen”:true,”lemonchiffon”:true,”lightblue”:true,”lightcoral”:true,”lightcyan”:true,”lightgoldenrodyellow”:true,”lightgreen”:true,”lightpink”:true,”lightsalmon”:true,”lightseagreen”:true,”lightskyblue”:true,”lightslategray”:true,”lightsteelblue”:true,”lightyellow”:true,”lime”:true,”limegreen”:true,”linen”:true,”magenta”:true,”maroon”:true,”mediumaquamarine”:true,”mediumblue”:true,”mediumorchid”:true,”mediumpurple”:true,”mediumseagreen”:true,”mediumslateblue”:true,”mediumspringgreen”:true,”mediumturquoise”:true,”mediumvioletred”:true,”midnightblue”:true,”mintcream”:true,”mistyrose”:true,”moccasin”:true,”navajowhite”:true,”navy”:true,”oldlace”:true,”olive”:true,”olivedrab”:true,”orange”:true,”orangered”:true,”orchid”:true,”palegoldenrod”:true,”palegreen”:true,”paleturquoise”:true,”palevioletred”:true,”papayawhip”:true,”peachpuff”:true,”peru”:true,”pink”:true,”plum”:true,”powderblue”:true,”purple”:true,”red”:true,”rosybrown”:true,”royalblue”:true,”saddlebrown”:true,”salmon”:true,”sandybrown”:true,”seagreen”:true,”seashell”:true,”sienna”:true,”silver”:true,”skyblue”:true,”slateblue”:true,”slategray”:true,”snow”:true,”springgreen”:true,”steelblue”:true,”tan”:true,”teal”:true,”thistle”:true,”tomato”:true,”turquoise”:true,”violet”:true,”wheat”:true,”white”:true,”whitesmoke”:true,”yellow”:true,”yellowgreen”:true},cssBorderStyle,cssLengthData={‘%’:true,’cm’:true,’em’:true,’ex’:true,’in’:true,’mm’:true,’pc’:true,’pt’:true,’px’:true},escapes={‘\b’:’\\b’,’\t’:’\\t’,’\n’:’\\n’,’\f’:’\\f’,’\r’:’\\r’,'”‘:’\\”‘,’/’:’\\/’,’\\’:’\\\\’},funct,functions,global,htmltag={a:{},abbr:{},acronym:{},address:{},applet:{},area:{empty:true,parent:’ map ‘},b:{},base:{empty:true,parent:’ head ‘},bdo:{},big:{},blockquote:{},body:{parent:’ html noframes ‘},br:{empty:true},button:{},canvas:{parent:’ body p div th td ‘},caption:{parent:’ table ‘},center:{},cite:{},code:{},col:{empty:true,parent:’ table colgroup ‘},colgroup:{parent:’ table ‘},dd:{parent:’ dl ‘},del:{},dfn:{},dir:{},div:{},dl:{},dt:{parent:’ dl ‘},em:{},embed:{},fieldset:{},font:{},form:{},frame:{empty:true,parent:’ frameset ‘},frameset:{parent:’ html frameset ‘},h1:{},h2:{},h3:{},h4:{},h5:{},h6:{},head:{parent:’ html ‘},html:{parent:’*’},hr:{empty:true},i:{},iframe:{},img:{empty:true},input:{empty:true},ins:{},kbd:{},label:{},legend:{parent:’ fieldset ‘},li:{parent:’ dir menu ol ul ‘},link:{empty:true,parent:’ head ‘},map:{},menu:{},meta:{empty:true,parent:’ head noframes noscript ‘},noframes:{parent:’ html body ‘},noscript:{parent:’ body head noframes ‘},object:{},ol:{},optgroup:{parent:’ select ‘},option:{parent:’ optgroup select ‘},p:{},param:{empty:true,parent:’ applet object ‘},pre:{},q:{},samp:{},script:{empty:true,parent:’ body div frame head iframe p pre span ‘},select:{},small:{},span:{},strong:{},style:{parent:’ head ‘,empty:true},sub:{},sup:{},table:{},tbody:{parent:’ table ‘},td:{parent:’ tr ‘},textarea:{},tfoot:{parent:’ table ‘},th:{parent:’ tr ‘},thead:{parent:’ table ‘},title:{parent:’ head ‘},tr:{parent:’ table tbody thead tfoot ‘},tt:{},u:{},ul:{},’var’:{}},ids,implied,inblock,indent,jsonmode,lines,lookahead,member,membersOnly,nexttoken,noreach,option,predefined,prereg,prevtoken,pseudorule={‘first-child’:true,link:true,visited:true,hover:true,active:true,focus:true,lang:true,’first-letter’:true,’first-line’:true,before:true,after:true},rhino={defineClass:true,deserialize:true,gc:true,help:true,load:true,loadClass:true,print:true,quit:true,readFile:true,readUrl:true,runCommand:true,seal:true,serialize:true,spawn:true,sync:true,toint32:true,version:true},scope,sidebar={System:true},src,stack,standard={Array:true,Boolean:true,Date:true,decodeURI:true,decodeURIComponent:true,encodeURI:true,encodeURIComponent:true,Error:true,’eval’:true,EvalError:true,Function:true,isFinite:true,isNaN:true,JSON:true,Math:true,Number:true,Object:true,parseInt:true,parseFloat:true,RangeError:true,ReferenceError:true,RegExp:true,String:true,SyntaxError:true,TypeError:true,URIError:true},standard_member={E:true,LN2:true,LN10:true,LOG2E:true,LOG10E:true,PI:true,SQRT1_2:true,SQRT2:true,MAX_VALUE:true,MIN_VALUE:true,NEGATIVE_INFINITY:true,POSITIVE_INFINITY:true},syntax={},tab,token,urls,warnings,widget={alert:true,animator:true,appleScript:true,beep:true,bytesToUIString:true,Canvas:true,chooseColor:true,chooseFile:true,chooseFolder:true,closeWidget:true,COM:true,convertPathToHFS:true,convertPathToPlatform:true,CustomAnimation:true,escape:true,FadeAnimation:true,filesystem:true,Flash:true,focusWidget:true,form:true,FormField:true,Frame:true,HotKey:true,Image:true,include:true,isApplicationRunning:true,iTunes:true,konfabulatorVersion:true,log:true,md5:true,MenuItem:true,MoveAnimation:true,openURL:true,play:true,Point:true,popupMenu:true,preferenceGroups:true,preferences:true,print:true,prompt:true,random:true,Rectangle:true,reloadWidget:true,ResizeAnimation:true,resolvePath:true,resumeUpdates:true,RotateAnimation:true,runCommand:true,runCommandInBg:true,saveAs:true,savePreferences:true,screen:true,ScrollBar:true,showWidgetPreferences:true,sleep:true,speak:true,Style:true,suppressUpdates:true,system:true,tellWidget:true,Text:true,TextArea:true,Timer:true,unescape:true,updateNow:true,URL:true,Web:true,widget:true,Window:true,XMLDOM:true,XMLHttpRequest:true,yahooCheckLogin:true,yahooLogin:true,yahooLogout:true},xmode,xquote,ax=/@cc|<\/?|script|\]*s\]|<\s*!|&lt/i,cx=/[\u0000-\u001f\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/,tx=/^\s*([(){}\[.,:;'”~\?\]#@]|==?=?|\/(\*(global|extern|jslint|member|members)?|=|\/)?|\*[\/=]?|\+[+=]?|-[\-=]?|%=?|&[&=]?|\|[|=]?|>>?>?=?|<([\/=!]|\!(\[|–)?|<=?)?|\^=?|\!=?=?|[a-zA-Z_$][a-zA-Z0-9_$]*|[0-9]+([xX][0-9a-fA-F]+|\.[0-9]*)?([eE][+\-]?[0-9]+)?)/,hx=/^\s*([‘”=>\/&#]|<(?:\/|\!(?:–)?)?|[a-zA-Z][a-zA-Z0-9_\-]*|[0-9]+|–|.)/,nx=/[\u0000-\u001f&<“\/\\\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/,nxg=/[\u0000-\u001f&<“\/\\\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,ox=/[>&]|<[\/!]?|–/,lx=/\*\/|\/\*/,ix=/^([a-zA-Z_$][a-zA-Z0-9_$]*)$/,jx=/^(?:javascript|jscript|ecmascript|vbscript|mocha|livescript)\s*:/i,ux=/&|\+|\u00AD|\.\.|\/\*|%[^;]|base64|url|expression|data|mailto/i,sx=/^\s*([{:#*%.=,>+\[\]@()”‘;*]|[a-zA-Z0-9_][a-zA-Z0-9_\-]*|<\/|\/\*)/,ssx=/^\s*([@#!”‘};:\-%.=,+\[\]()*_]|[a-zA-Z][a-zA-Z0-9._\-]*|\/\*?|\d+(?:\.\d+)?|<\/)/,qx=/[^a-zA-Z0-9-_\/ ]/,dx=/[\[\]\/\\”‘*<>.&:(){}+=#]/,rx={outer:hx,html:hx,style:sx,styleproperty:ssx};function F(){}

Lint at line 4 character 6051: eval is evil.
“use strict”;JSLINT=(function(){var adsafe_id,adsafe_may,adsafe_went,anonname,approved,atrule={‘import’:true,media:true,’font-face’:true,page:true},banned={apply:true,’arguments’:true,call:true,callee:true,caller:true,constructor:true,’eval’:true,prototype:true,unwatch:true,valueOf:true,watch:true},boolOptions={adsafe:true,bitwise:true,browser:true,cap:true,css:true,debug:true,eqeqeq:true,evil:true,forin:true,fragment:true,immed:true,laxbreak:true,newcap:true,nomen:true,on:true,onevar:true,passfail:true,plusplus:true,regexp:true,rhino:true,undef:true,safe:true,sidebar:true,strict:true,sub:true,white:true,widget:true},browser={alert:true,blur:true,clearInterval:true,clearTimeout:true,close:true,closed:true,confirm:true,console:true,Debug:true,defaultStatus:true,document:true,event:true,focus:true,frames:true,getComputedStyle:true,history:true,Image:true,length:true,location:true,moveBy:true,moveTo:true,name:true,navigator:true,onblur:true,onerror:true,onfocus:true,onload:true,onresize:true,onunload:true,open:true,opener:true,opera:true,Option:true,parent:true,print:true,prompt:true,resizeBy:true,resizeTo:true,screen:true,scroll:true,scrollBy:true,scrollTo:true,setInterval:true,setTimeout:true,status:true,top:true,XMLHttpRequest:true},cssAttributeData,cssAny,cssColorData={“aliceblue”:true,”antiquewhite”:true,”aqua”:true,”aquamarine”:true,”azure”:true,”beige”:true,”bisque”:true,”black”:true,”blanchedalmond”:true,”blue”:true,”blueviolet”:true,”brown”:true,”burlywood”:true,”cadetblue”:true,”chartreuse”:true,”chocolate”:true,”coral”:true,”cornflowerblue”:true,”cornsilk”:true,”crimson”:true,”cyan”:true,”darkblue”:true,”darkcyan”:true,”darkgoldenrod”:true,”darkgray”:true,”darkgreen”:true,”darkkhaki”:true,”darkmagenta”:true,”darkolivegreen”:true,”darkorange”:true,”darkorchid”:true,”darkred”:true,”darksalmon”:true,”darkseagreen”:true,”darkslateblue”:true,”darkslategray”:true,”darkturquoise”:true,”darkviolet”:true,”deeppink”:true,”deepskyblue”:true,”dimgray”:true,”dodgerblue”:true,”firebrick”:true,”floralwhite”:true,”forestgreen”:true,”fuchsia”:true,”gainsboro”:true,”ghostwhite”:true,”gold”:true,”goldenrod”:true,”gray”:true,”green”:true,”greenyellow”:true,”honeydew”:true,”hotpink”:true,”indianred”:true,”indigo”:true,”ivory”:true,”khaki”:true,”lavender”:true,”lavenderblush”:true,”lawngreen”:true,”lemonchiffon”:true,”lightblue”:true,”lightcoral”:true,”lightcyan”:true,”lightgoldenrodyellow”:true,”lightgreen”:true,”lightpink”:true,”lightsalmon”:true,”lightseagreen”:true,”lightskyblue”:true,”lightslategray”:true,”lightsteelblue”:true,”lightyellow”:true,”lime”:true,”limegreen”:true,”linen”:true,”magenta”:true,”maroon”:true,”mediumaquamarine”:true,”mediumblue”:true,”mediumorchid”:true,”mediumpurple”:true,”mediumseagreen”:true,”mediumslateblue”:true,”mediumspringgreen”:true,”mediumturquoise”:true,”mediumvioletred”:true,”midnightblue”:true,”mintcream”:true,”mistyrose”:true,”moccasin”:true,”navajowhite”:true,”navy”:true,”oldlace”:true,”olive”:true,”olivedrab”:true,”orange”:true,”orangered”:true,”orchid”:true,”palegoldenrod”:true,”palegreen”:true,”paleturquoise”:true,”palevioletred”:true,”papayawhip”:true,”peachpuff”:true,”peru”:true,”pink”:true,”plum”:true,”powderblue”:true,”purple”:true,”red”:true,”rosybrown”:true,”royalblue”:true,”saddlebrown”:true,”salmon”:true,”sandybrown”:true,”seagreen”:true,”seashell”:true,”sienna”:true,”silver”:true,”skyblue”:true,”slateblue”:true,”slategray”:true,”snow”:true,”springgreen”:true,”steelblue”:true,”tan”:true,”teal”:true,”thistle”:true,”tomato”:true,”turquoise”:true,”violet”:true,”wheat”:true,”white”:true,”whitesmoke”:true,”yellow”:true,”yellowgreen”:true},cssBorderStyle,cssLengthData={‘%’:true,’cm’:true,’em’:true,’ex’:true,’in’:true,’mm’:true,’pc’:true,’pt’:true,’px’:true},escapes={‘\b’:’\\b’,’\t’:’\\t’,’\n’:’\\n’,’\f’:’\\f’,’\r’:’\\r’,'”‘:’\\”‘,’/’:’\\/’,’\\’:’\\\\’},funct,functions,global,htmltag={a:{},abbr:{},acronym:{},address:{},applet:{},area:{empty:true,parent:’ map ‘},b:{},base:{empty:true,parent:’ head ‘},bdo:{},big:{},blockquote:{},body:{parent:’ html noframes ‘},br:{empty:true},button:{},canvas:{parent:’ body p div th td ‘},caption:{parent:’ table ‘},center:{},cite:{},code:{},col:{empty:true,parent:’ table colgroup ‘},colgroup:{parent:’ table ‘},dd:{parent:’ dl ‘},del:{},dfn:{},dir:{},div:{},dl:{},dt:{parent:’ dl ‘},em:{},embed:{},fieldset:{},font:{},form:{},frame:{empty:true,parent:’ frameset ‘},frameset:{parent:’ html frameset ‘},h1:{},h2:{},h3:{},h4:{},h5:{},h6:{},head:{parent:’ html ‘},html:{parent:’*’},hr:{empty:true},i:{},iframe:{},img:{empty:true},input:{empty:true},ins:{},kbd:{},label:{},legend:{parent:’ fieldset ‘},li:{parent:’ dir menu ol ul ‘},link:{empty:true,parent:’ head ‘},map:{},menu:{},meta:{empty:true,parent:’ head noframes noscript ‘},noframes:{parent:’ html body ‘},noscript:{parent:’ body head noframes ‘},object:{},ol:{},optgroup:{parent:’ select ‘},option:{parent:’ optgroup select ‘},p:{},param:{empty:true,parent:’ applet object ‘},pre:{},q:{},samp:{},script:{empty:true,parent:’ body div frame head iframe p pre span ‘},select:{},small:{},span:{},strong:{},style:{parent:’ head ‘,empty:true},sub:{},sup:{},table:{},tbody:{parent:’ table ‘},td:{parent:’ tr ‘},textarea:{},tfoot:{parent:’ table ‘},th:{parent:’ tr ‘},thead:{parent:’ table ‘},title:{parent:’ head ‘},tr:{parent:’ table tbody thead tfoot ‘},tt:{},u:{},ul:{},’var’:{}},ids,implied,inblock,indent,jsonmode,lines,lookahead,member,membersOnly,nexttoken,noreach,option,predefined,prereg,prevtoken,pseudorule={‘first-child’:true,link:true,visited:true,hover:true,active:true,focus:true,lang:true,’first-letter’:true,’first-line’:true,before:true,after:true},rhino={defineClass:true,deserialize:true,gc:true,help:true,load:true,loadClass:true,print:true,quit:true,readFile:true,readUrl:true,runCommand:true,seal:true,serialize:true,spawn:true,sync:true,toint32:true,version:true},scope,sidebar={System:true},src,stack,standard={Array:true,Boolean:true,Date:true,decodeURI:true,decodeURIComponent:true,encodeURI:true,encodeURIComponent:true,Error:true,’eval’:true,EvalError:true,Function:true,isFinite:true,isNaN:true,JSON:true,Math:true,Number:true,Object:true,parseInt:true,parseFloat:true,RangeError:true,ReferenceError:true,RegExp:true,String:true,SyntaxError:true,TypeError:true,URIError:true},standard_member={E:true,LN2:true,LN10:true,LOG2E:true,LOG10E:true,PI:true,SQRT1_2:true,SQRT2:true,MAX_VALUE:true,MIN_VALUE:true,NEGATIVE_INFINITY:true,POSITIVE_INFINITY:true},syntax={},tab,token,urls,warnings,widget={alert:true,animator:true,appleScript:true,beep:true,bytesToUIString:true,Canvas:true,chooseColor:true,chooseFile:true,chooseFolder:true,closeWidget:true,COM:true,convertPathToHFS:true,convertPathToPlatform:true,CustomAnimation:true,escape:true,FadeAnimation:true,filesystem:true,Flash:true,focusWidget:true,form:true,FormField:true,Frame:true,HotKey:true,Image:true,include:true,isApplicationRunning:true,iTunes:true,konfabulatorVersion:true,log:true,md5:true,MenuItem:true,MoveAnimation:true,openURL:true,play:true,Point:true,popupMenu:true,preferenceGroups:true,preferences:true,print:true,prompt:true,random:true,Rectangle:true,reloadWidget:true,ResizeAnimation:true,resolvePath:true,resumeUpdates:true,RotateAnimation:true,runCommand:true,runCommandInBg:true,saveAs:true,savePreferences:true,screen:true,ScrollBar:true,showWidgetPreferences:true,sleep:true,speak:true,Style:true,suppressUpdates:true,system:true,tellWidget:true,Text:true,TextArea:true,Timer:true,unescape:true,updateNow:true,URL:true,Web:true,widget:true,Window:true,XMLDOM:true,XMLHttpRequest:true,yahooCheckLogin:true,yahooLogin:true,yahooLogout:true},xmode,xquote,ax=/@cc|<\/?|script|\]*s\]|<\s*!|&lt/i,cx=/[\u0000-\u001f\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/,tx=/^\s*([(){}\[.,:;'”~\?\]#@]|==?=?|\/(\*(global|extern|jslint|member|members)?|=|\/)?|\*[\/=]?|\+[+=]?|-[\-=]?|%=?|&[&=]?|\|[|=]?|>>?>?=?|<([\/=!]|\!(\[|–)?|<=?)?|\^=?|\!=?=?|[a-zA-Z_$][a-zA-Z0-9_$]*|[0-9]+([xX][0-9a-fA-F]+|\.[0-9]*)?([eE][+\-]?[0-9]+)?)/,hx=/^\s*([‘”=>\/&#]|<(?:\/|\!(?:–)?)?|[a-zA-Z][a-zA-Z0-9_\-]*|[0-9]+|–|.)/,nx=/[\u0000-\u001f&<“\/\\\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/,nxg=/[\u0000-\u001f&<“\/\\\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/g,ox=/[>&]|<[\/!]?|–/,lx=/\*\/|\/\*/,ix=/^([a-zA-Z_$][a-zA-Z0-9_$]*)$/,jx=/^(?:javascript|jscript|ecmascript|vbscript|mocha|livescript)\s*:/i,ux=/&|\+|\u00AD|\.\.|\/\*|%[^;]|base64|url|expression|data|mailto/i,sx=/^\s*([{:#*%.=,>+\[\]@()”‘;*]|[a-zA-Z0-9_][a-zA-Z0-9_\-]*|<\/|\/\*)/,ssx=/^\s*([@#!”‘};:\-%.=,+\[\]()*_]|[a-zA-Z][a-zA-Z0-9._\-]*|\/\*?|\d+(?:\.\d+)?|<\/)/,qx=/[^a-zA-Z0-9-_\/ ]/,dx=/[\[\]\/\\”‘*<>.&:(){}+=#]/,rx={outer:hx,html:hx,style:sx,styleproperty:ssx};function F(){}

Lint at line 119 character 36: eval is evil.
if(!option.evil&&nexttoken.value===’eval’){warning(“eval is evil.”,nexttoken);}}

Lint at line 350 character 604: eval is evil.
return this;},led:function(){error(“Expected an operator and instead saw ‘{a}’.”,nexttoken,nexttoken.value);}};type(‘(regexp)’,function(){return this;});delim(‘(endline)’);delim(‘(begin)’);delim(‘(end)’).reach=true;delim(‘</’).reach=true;delim(‘<!’);delim(‘<!–‘);delim(‘–>’);delim(‘(error)’).reach=true;delim(‘}’).reach=true;delim(‘)’);delim(‘]’);delim(‘”‘).reach=true;delim(“‘”).reach=true;delim(‘;’);delim(‘:’).reach=true;delim(‘,’);delim(‘#’);delim(‘@’);reserve(‘else’);reserve(‘case’).reach=true;reserve(‘catch’);reserve(‘default’).reach=true;reserve(‘finally’);reservevar(‘arguments’);reservevar(‘eval’);reservevar(‘false’);reservevar(‘Infinity’);reservevar(‘NaN’);reservevar(‘null’);reservevar(‘this’);reservevar(‘true’);reservevar(‘undefined’);assignop(‘=’,’assign’,20);assignop(‘+=’,’assignadd’,20);assignop(‘-=’,’assignsub’,20);assignop(‘*=’,’assignmult’,20);assignop(‘/=’,’assigndiv’,20).nud=function(){error(“A regular expression literal can be confused with ‘/=’.”);};assignop(‘%=’,’assignmod’,20);bitwiseassignop(‘&=’,’assignbitand’,20);bitwiseassignop(‘|=’,’assignbitor’,20);bitwiseassignop(‘^=’,’assignbitxor’,20);bitwiseassignop(‘<<=’,’assignshiftleft’,20);bitwiseassignop(‘>>=’,’assignshiftright’,20);bitwiseassignop(‘>>>=’,’assignshiftrightunsigned’,20);infix(‘?’,function(left,that){that.left=left;that.right=parse(10);advance(‘:’);that[‘else’]=parse(10);return that;},30);infix(‘||’,’or’,40);infix(‘&&’,’and’,50);bitwise(‘|’,’bitor’,70);bitwise(‘^’,’bitxor’,80);bitwise(‘&’,’bitand’,90);relation(‘==’,function(left,right){if(option.eqeqeq){warning(“Expected ‘{a}’ and instead saw ‘{b}’.”,this,’===’,’==’);}else if(isPoorRelation(left)){warning(“Use ‘{a}’ to compare with ‘{b}’.”,this,’===’,left.value);}else if(isPoorRelation(right)){warning(“Use ‘{a}’ to compare with ‘{b}’.”,this,’===’,right.value);}

Lint at line 373 character 34: eval is evil.
if(!option.evil){if(left.value===’eval’||left.value===’Function’||left.value===’execScript’){warning(“eval is evil.”,left);}else if(p[0]&&p[0].id==='(string)’&&(left.value===’setTimeout’||left.value===’setInterval’)){warning(“Implied eval is evil. Pass a function instead of a string.”,left);}}

Lint at line 445 character 248: eval is evil.
if(o.safe){o.browser=false;o.css=false;o.debug=false;o.eqeqeq=true;o.evil=false;o.forin=false;o.nomen=true;o.on=false;o.rhino=false;o.safe=true;o.sidebar=false;o.strict=true;o.sub=false;o.undef=true;o.widget=false;predefined.Date=false;predefined[‘eval’]=false;predefined.Function=false;predefined.Object=false;predefined.ADSAFE=true;predefined.lib=true;}

real    1m52.358s
user    1m52.047s
sys    0m0.232s

Ok, looks like their code is ok if the childish “eval is evil” warnings are ignored. However what does JavaScript Lint say. Turns out it’s much more interesting:

time jsl -conf /my/bin/jsl.conf -process jslint.js
JavaScript Lint 0.3.0 (JavaScript-C 1.5 2004-09-24)
Developed by Matthias Miller (http://www.JavaScriptLint.com)

jslint.js
/my/bin/jslint.js(32): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(32): lint warning: missing default case in switch statement
/my/bin/jslint.js(33): warning: anonymous function does not always return a value
/my/bin/jslint.js(42): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(43): warning: function string does not always return a value
/my/bin/jslint.js(53): lint warning: regular expressions should be preceded by a left parenthesis, assignment, colon, or comma
/my/bin/jslint.js(59): warning: anonymous function does not always return a value
/my/bin/jslint.js(61): warning: anonymous function does not always return a value
/my/bin/jslint.js(62): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(67): lint warning: use of label
/my/bin/jslint.js(71): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(72): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(72): lint warning: missing default case in switch statement
/my/bin/jslint.js(81): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(81): lint warning: missing default case in switch statement
/my/bin/jslint.js(82): warning: anonymous function does not always return a value
/my/bin/jslint.js(83): warning: anonymous function does not always return a value
/my/bin/jslint.js(86): warning: anonymous function does not always return a value
/my/bin/jslint.js(87): warning: anonymous function does not always return a value
/my/bin/jslint.js(90): warning: anonymous function does not always return a value
/my/bin/jslint.js(90): warning: anonymous function does not always return a value
/my/bin/jslint.js(97): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(97): lint warning: missing default case in switch statement
/my/bin/jslint.js(114): lint warning: missing default case in switch statement
/my/bin/jslint.js(160): warning: anonymous function does not always return a value
/my/bin/jslint.js(166): warning: anonymous function does not always return a value
/my/bin/jslint.js(172): warning: function identifier does not always return a value
/my/bin/jslint.js(184): warning: function statement does not always return a value
/my/bin/jslint.js(185): lint warning: regular expressions should be preceded by a left parenthesis, assignment, colon, or comma
/my/bin/jslint.js(193): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(193): lint warning: missing default case in switch statement
/my/bin/jslint.js(222): lint warning: missing default case in switch statement
/my/bin/jslint.js(222): warning: function cssWidth does not always return a value
/my/bin/jslint.js(229): warning: function cssCommaList does not always return a value
/my/bin/jslint.js(230): lint warning: empty statement or extra semicolon
/my/bin/jslint.js(247): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(248): warning: anonymous function does not always return a value
/my/bin/jslint.js(255): lint warning: missing default case in switch statement
/my/bin/jslint.js(261): warning: function styleValue does not always return a value
/my/bin/jslint.js(280): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(282): warning: function stylePattern does not always return a value
/my/bin/jslint.js(289): lint warning: regular expressions should be preceded by a left parenthesis, assignment, colon, or comma
/my/bin/jslint.js(289): lint warning: regular expressions should be preceded by a left parenthesis, assignment, colon, or comma
/my/bin/jslint.js(293): lint warning: regular expressions should be preceded by a left parenthesis, assignment, colon, or comma
/my/bin/jslint.js(306): lint warning: duplicate case in switch statements
/my/bin/jslint.js(306): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(309): lint warning: missing default case in switch statement
/my/bin/jslint.js(343): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(347): lint warning: missing default case in switch statement
/my/bin/jslint.js(349): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(349): lint warning: missing default case in switch statement
/my/bin/jslint.js(349): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(356): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(399): warning: function functionparams does not always return a value
/my/bin/jslint.js(399): warning: function functionparams does not always return a value
/my/bin/jslint.js(411): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(412): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(414): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(414): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(415): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(424): warning: anonymous function does not always return a value
/my/bin/jslint.js(442): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(452): lint warning: missing break statement for last case in switch
/my/bin/jslint.js(466): lint warning: missing default case in switch statement

0 error(s), 64 warning(s)
real 0m0.083s
user 0m0.068s
sys 0m0.008s

So, kind of neat how jslint.js is a JavaScript file but it appears to be weak, wimpy, and worthless. Meaning it doesn’t catch nearly as many possible problems and it took over 1652 times longer than JavaScript Lint.

However. The website version of jslint is much better. It’s faster and allows various options than it’s CLI version. Still it reported what seemed like spurious errors and miscellaneous information that was just plain confusing if even correct. (It was probably correct but I just didn’t have the desire to figure out what it was going on about.) The options are fun to play with but who wants to cut and paste to a website?

May 4, 2009

JavaScript Code Coverage On Ubuntu

Filed under: Code Coverage, Firefox, howto, Linux, tutorial, ubuntu — Tags: , — ioconnor @ 10:24 am

I’ve been playing with JavaScript looking for QA tools, getting JavaScript Lint in vim on Ubuntu, etc.. Now I’ve got code coverage analysis going for it. Follow these instructions to install JavaScript Code Coverage on Ubuntu:

  1. Download from and unpack.
  2. Change directory to where it was unpacked:

    cd jscoverage-0.4/
  3. Configure the environment for Ubuntu:

    ./configure
  4. Compile the program:

    make
  5. Copy jscoverage-server to your personal bin:

    cp jscoverage-server /my/bin
  6. The jscoverage documentation does not mention it but you must start jscoverage-server from the directory where it is to be serving the javascript from. So to run their examples move to the directory where their example code is:

    cd jscoverage-0.4/doc/example/
  7. Now start up the coverage server from the same directory the javascript is located:

    jscoverage-server –verbose
  8. Open up a browser where index.html is the starting point of the code you are going to test:

    firefox http://127.0.0.1:8080/jscoverage.html?index.html
  9. Execute the code a bit and then move to the store tab and press the store button.
  10. Open up another browser to view the results:

    firefox jscoverage-report/jscoverage.html
  11. Possibly open another browser, like opera, and test with it. All the additional tests will be added to the report.
  12. Now if you have the directory available via the network test the code with IE.

At this point it’s a simple matter of writing the javascript as a separate library.
Once in a separate library each function can be called separately.
Unit tests can then be written attempting to maximize code coverage and results can be verified.
Once this is done then the user interfaces can be tested.

There are some caveats listed in the manual. They all seem quite acceptable.

  1. JSCoverage adds instrumentation to JavaScript code, which will slow down execution speed. Expect instrumented code to take at least twice as much time to run.
  2. JSCoverage currently instruments only .js files; it does not instrument code in script elements in HTML files.
  3. HTML files must use relative URLs to reference scripts. If you use an absolute URL, your page will reference the original uninstrumented script rather than the instrumented one, and no code coverage data will be collected.
  4. JSCoverage instruments physical lines of code rather than logical JavaScript statements; it works bests with code that has exactly one statement per line. If you put multiple statements on a line, or split a line across two or more statements, you may get strange results.
  5. JSCoverage uses frames. Some web pages that use frames may not function properly when run under JSCoverage, especially those which try to access the top-level frame (window.top, target=”_top”, etc.).

I don’t see any way of incorporating the results into vim.
It would be nice if that were possible though.
I think the best that can be done would simply be to start a page that would call the various functions with assert statements.
Perhaps via a bash script.
Maybe I’ll learn more when I look into the jsunit tools.
As it now stands all of the error paths are questionable.
Still it’s better than no code coverage.

May 2, 2009

JavaScriptLint, Vim, And Ubuntu

Filed under: debugging, Firefox, Lint — Tags: , , , , , , — ioconnor @ 7:30 pm

In my blog https://ioconnor.wordpress.com/2009/04/24/javascript-testing/ I looked into some tools to help in my JavaScript development. I haven’t had the time, (or urge?), to do anything until this morning. This morning though I got JavaScriptLint working. The documentation at the site is less than adequate so I’m adding notes here to help me if I need to install it again in the future.

  1. The Linux download is here: http://www.javascriptlint.com/download.htm
  2. After decompressing it you’ll notice there is only a single horribly wrong README.html file. To get things working compile it by going to the src directory and typing:
    make -f Makefile.ref
  3. A jsl will now be found in jsl-0.3.0/src/Linux_All_DBG.OBJ/jsl. To make it generally accessible do something like:
    ln -s /whatever/jsl-0.3.0/src/Linux_All_DBG.OBJ /my/bin/jsl
  4. Running jsl will show the parameters that are needed. If you are like me you’ll wonder where the configuration file is that they mention. It’s not on their website and it certainly is nowhere on my disk. So I googled around until I found it, or close to what it should probaly be, and have copied it down below. I called the file “jsl.conf” and stuck it in /my/bin/jsl.conf.
  5. It’s all fine and good running it on the command line. It even looks at the javascript code in html files. I found quite a few questionable pieces of code and one clear mistake on my part that fortunately was not causing any problems. From the command line type something like:
    jsl -conf /my/bin/jsl.conf -process /my/dev/taxes2.html
    The -conf /my/bin/jsl.conf is optional.
  6. To run it from within vim by pressing the <F9> key edit the vimrc file and include something like:
    map <F9> : call JavaScriptLint()<CR>
    func! JavaScriptLint()
    exec “w” “Save the file
    exec “!jsl -conf /my/bin/jsl.conf -process % ”
    endfunc

I might change this so the editor dumps me on the line that’s bad with an error message. Or into an error file that can be toggled back and forth from. However it is usable enough for me in it’s current form.

The conf file I’m using looks like this:

#
# Configuration File for JavaScript Lint 0.3.0
# Developed by Matthias Miller (http://www.JavaScriptLint.com)
#
# This configuration file can be used to lint a collection of scripts, or to enable
# or disable warnings for scripts that are linted via the command line.
#

### Warnings
# Enable or disable warnings based on requirements.
# Use “+WarningName” to display or “-WarningName” to suppress.
#
+no_return_value # function {0} does not always return a value
+duplicate_formal # duplicate formal argument {0}
+equal_as_assign # test for equality (==) mistyped as assignment (=)?{0}
+var_hides_arg # variable {0} hides argument
+redeclared_var # redeclaration of {0} {1}
+anon_no_return_value # anonymous function does not always return a value
+missing_semicolon # missing semicolon
+meaningless_block # meaningless block; curly braces have no impact
+comma_separated_stmts # multiple statements separated by commas (use semicolons?)
+unreachable_code # unreachable code
+missing_break # missing break statement
+missing_break_for_last_case # missing break statement for last case in switch
+comparison_type_conv # comparisons against null, 0, true, false, or an empty string allowing implicit type conversion (use === or !==)
+inc_dec_within_stmt # increment (++) and decrement (–) operators used as part of greater statement
+useless_void # use of the void type may be unnecessary (void is always undefined)
+multiple_plus_minus # unknown order of operations for successive plus (e.g. x+++y) or minus (e.g. x—y) signs
+use_of_label # use of label
+block_without_braces # block statement without curly braces
+leading_decimal_point # leading decimal point may indicate a number or an object member
+trailing_decimal_point # trailing decimal point may indicate a number or an object member
+octal_number # leading zeros make an octal number
+nested_comment # nested comment
+misplaced_regex # regular expressions should be preceded by a left parenthesis, assignment, colon, or comma
+ambiguous_newline # unexpected end of line; it is ambiguous whether these lines are part of the same statement
+empty_statement # empty statement or extra semicolon
-missing_option_explicit # the “option explicit” control comment is missing
+partial_option_explicit # the “option explicit” control comment, if used, must be in the first script tag
+dup_option_explicit # duplicate “option explicit” control comment
+useless_assign # useless assignment
+ambiguous_nested_stmt # block statements containing block statements should use curly braces to resolve ambiguity
+ambiguous_else_stmt # the else statement could be matched with one of multiple if statements (use curly braces to indicate intent)
+missing_default_case # missing default case in switch statement
+duplicate_case_in_switch # duplicate case in switch statements
+default_not_at_end # the default case is not at the end of the switch statement
+legacy_cc_not_understood # couldn’t understand control comment using /*@keyword@*/ syntax
+jsl_cc_not_understood # couldn’t understand control comment using /*jsl:keyword*/ syntax
+useless_comparison # useless comparison; comparing identical expressions
+with_statement # with statement hides undeclared variables; use temporary variable instead
+trailing_comma_in_array # extra comma is not recommended in array initializers
+assign_to_function_call # assignment to a function call
+parseint_missing_radix # parseInt missing radix parameter

### Output format
# Customize the format of the error message.
# __FILE__ indicates current file path
# __FILENAME__ indicates current file name
# __LINE__ indicates current line
# __ERROR__ indicates error message
#
# Visual Studio syntax (default):
+output-format __FILE__(__LINE__): __ERROR__
# Alternative syntax:
#+output-format __FILE__:__LINE__: __ERROR__

### Context
# Show the in-line position of the error.
# Use “+context” to display or “-context” to suppress.
#
-context

### Semicolons
# By default, assignments of an anonymous function to a variable or
# property (such as a function prototype) must be followed by a semicolon.
#
+lambda_assign_requires_semicolon

### Control Comments
# Both JavaScript Lint and the JScript interpreter confuse each other with the syntax for
# the /*@keyword@*/ control comments and JScript conditional comments. (The latter is
# enabled in JScript with @cc_on@). The /*jsl:keyword*/ syntax is preferred for this reason,
# although legacy control comments are enabled by default for backward compatibility.
#
+legacy_control_comments

### JScript Function Extensions
# JScript allows member functions to be defined like this:
# function MyObj() { /*constructor*/ }
# function MyObj.prototype.go() { /*member function*/ }
#
# It also allows events to be attached like this:
# function window::onload() { /*init page*/ }
#
# This is a Microsoft-only JavaScript extension. Enable this setting to allow them.
#
-jscript_function_extensions

### Defining identifiers
# By default, “option explicit” is enabled on a per-file basis.
# To enable this for all files, use “+always_use_option_explicit”
-always_use_option_explicit

# Define certain identifiers of which the lint is not aware.
# (Use this in conjunction with the “undeclared identifier” warning.)
#
# Common uses for webpages might be:
#+define window
#+define document

### Interactive
# Prompt for a keystroke before exiting.
#+pauseatend

### Files
# Specify which files to lint
# Use “+recurse” to enable recursion (disabled by default).
# To add a set of files, use “+process FileName”, “+process Folder\Path\*.js”,
# or “+process Folder\Path\*.htm”.
#
#+process jsl-test.js

April 24, 2009

JavaScript Testing

I’m finding my JavaScript code is not behaving as I’d like it to. Code I thought was solid and have been using consistently is less than solid. Code involving money. So it’s time to start rigorously testing things as if I were coding in C/C++. At http://www.opensourcetesting.org/unit_javascript.php is a list of free tools that can help.

  1. CrossCheck. It seems to concentrate on verifing the code will run on multiple browsers. Making sure things work on buggy browsers like IE is not big on my list.
  2. JavaScript Assertion Unit. Assertion testing. Might be all I need. Probably not though. I don’t want to complicate the code itself. I’d like to have a separate unit supplying the input and comparing it to expected results that can be used by code coverage tests too.
  3. JSCoverage. This runs the latest Linux and Firefox distros and looks very promising. It only checks coverage though. Nothing else.
  4. JSMock. The documentation is less than clear. I can’t tell if it can be automated, if it runs on Linux, or even what it does. Hopefully it allows test scripts to suppy and perhaps change values within the called functions and compare the results. However if it does do this it does not plainly say it.
  5. JSNUnit. A product made for M$ environments. Does not work in Linux.
  6. JSUnit. Tests multiple browser javascript on multiple OSs. It looks very promising in that you can write test scripts to run the pages, functions, and possibly even alter values. Hopefully allowing the JSCoverage to run at the same time. I’ll probably start with this tool.
  7. JSUnit. I’m not sure how this one differs from the other JSUnit. I’d best compare the two carefully before deciding which one to use.
  8. RhinoUnit. It is tied to ANT. It mentions having integrated support for JSLint.
  9. JSLint. I’m not sure if this can be run standalone. Perhaps this page will explain it better: http://www.jslint.com/rhino/index.html
  10. JavaScript Lint. Hmmm.

Some of the criteria I’m looking for are:

  1. Fully Automatable.
  2. Speed.
  3. Ease.
  4. Runs on Linux.
  5. Coverage Check.
  6. Free.
  7. Actively supported.
  8. RegEx comparisons.

The Lints are the natural place to start. I’ll somehow make some bash scripts to test them and go from there.

April 5, 2009

Starting Skeleton, Template, For Sqlite Google Gear Self-Contained Client Apps

Client side applications using google gears for locally storing SQL data are obviously the future. They allow applications to be run on any operating system without coding user interfaces, learning new languages, or managing SQL database daemons/servers. You can start by running the application off a server. But it’s much better to simply download the web page and run it disconnected from the internet. To start the application in the future you simply click on the html file you downloaded.  It is so cool.

Where are all the example sites describing how to use google gears for client side applications though? I’ve looked for starting point skeletons and have found NONE! I believe it is because the subject is new. So I’m publishing my own skeleton. It can be found at http://ioconnor.atbhost.net/google.gears.skeleton.html. I’ll probably upgrade it as time goes on but my skeleton is quite good already. After you read through Google’s tutorials at http://code.google.com/apis/gears/tutorial.html download my code and use it as a starting point for your own project. Don’t reinvent the wheel!

My skeleton is self-contained. There’s no need to download a set of files or update a registry, run an installation script, etc., assuming your environment is complete.

However if your base environment is not complete no problem. The environment is tested to verify the gears addon has already been installed, that javascript is enabled, and that you have an up-to-date browser. If something is lacking you must click “ok” to acknowledge the problem and then your browser takes you to the URL where  the fix is.

I wish I had this easy to use skeleton a long time ago. It makes client side browser applications using SQL easy!

I’m probably going to make quite a few client side browser applications using this template. Having a free interface, sql database, and programming language across all OS platforms levels the playing field so much it can’t be ignored.

Update 2009.04.08: The code was refined yet again tonight. There’s nothing in it that seems to be lacking that can be done better. However please comment on it if there is something more that could be done…

April 4, 2009

JavaScript: Multi-line Strings

Filed under: heredoc, JavaScript, multi-line strings, string concatenation, Uncategorized — Tags: — ioconnor @ 4:53 pm

Multi-line strings in JavaScript should not be difficult. It’s something everybody needs to do. Like “Here Documents” in bash. With this in mind the following books were scanned:

  1. JavaScript The Definitive Guide, 5th Edition
  2. JavaScript Bible, Sixth Edition
  3. Professional JavaScript
  4. JavaScript For The World Wide Web, 3rd Edition
  5. Ajax Hacks
  6. DOM Scripting
  7. Ajax Design Patterns

For the following terms:

  1. +
  2. +=
  3. \
  4. <<
  5. Concatenat*
  6. Continu*
  7. Here*
  8. Multi*
  9. String*

The best solutions in all those books were:

<script>
var string = “blah blah” +
“blah blah”;
</script>

and

<script>
var string = “blah blah”;
string += “blah blah”;
</script>

I haven’t figured out when to do a web search as opposed to a book search. Sometimes web solutions are horrible and people tend to repeat the same horrible solutions. Searching for the one good answer means looking at the same old bad solutions reiterated ad nausea. However these book solutions were horrible too.
Turning to the web I found several new solutions. I have yet to try them.

update 2009.04.08: I really don’t understand the following. I’m thinking perhaps they meant a div setting the visibility to hidden and the space it uses to zero. Then taking the text out of the div as needed. However what they posted I copied and as you can see it does not make any sense.

<script id=”blah”>
blah blah
blah blah
</script>
<script>
var string = document.getElementById(”blah”).innerHTML;
</script>

Update 2009.04.08: The following sort of works under some browers. But it does not work in enough to be worth the time it takes. There is another variation of this which does away with the ‘().toString();’ by merely including a ‘””+’ that makes it easier to understand:

<script>
var string = (<r><![CDATA[
The text string goes here. Since this is a XML CDATA section,
stuff like <> work fine too, even if definitely invalid XML.
However it does not work with IE6 and older browsers.
]]></r>).toString();
</script>

and the following everywhere works but is ugly:

<script>
var string = “blah blah\
blah blah\
“;
</script>

Why do the books not contain how to do these simple tasks? You’d think they’d cover the basics. Some of these books have had 5 or 6 editions to get the basics in to them! Maybe when I try them later I’ll discover they don’t work and that’s why they never made it into the books… OR… Doth JavaScript books truly sucketh?

Stripped Google Gears Causing Accidents

Filed under: debugging, Firefox, GEARS, GOOGLE, howto, JavaScript, Linux, tutorial, typeof, ubuntu — Tags: , , , , , — ioconnor @ 12:02 am

Attempting to use Google Gears when it is not installed on a user’s browser causes an error. You’d think their library would handle this more gracefully than just crashing but it doesn’t.
UPDATED 2009.04.04: Their library should define the call but return something akin to an alert warning the user/developer

The crash occurs on this line:

g_db = google.gears.factory.create(‘beta.database’);

I pulled out my “JavaScript The Definitive Guide 5th Edition” looking for how to get around this. (This is my primary reference book for all things JavaScript. Perhaps if I were better at JavaScript it would be second nature but I’m not good at JavaScript so I spend lots of time looking things up.) I figured “google…” was not defined. So I looked at the index and put a paperclip on each page in the book referenced by the index. Then I tried all sorts of combinations none of which would work. Things like:

if (google === undefined) {
alert(“A”);
} else {
alert(“B”);
}

and

if (google == undefined) {
alert(“A”);
} else {
alert(“B”);
}

and

if (“gears” in google) {
alert(“A”);
} else {
alert(“B”);
}

and

if (google) {
alert(“A”);
} else {
alert(“B”);
}

and

if (google.gears) {
alert(“A”);
} else {
alert(“B”);
}

and

if (“length” in google) {
alert(“A”);
} else {
alert(“B”);
}

but none of above worked! There were no other solutions in my reference book. My reference book doth sucketh.

So I used a try/catch for a while but I’d still get an error message in the “error console”. The try/catch is ugly but it let me do what I needed and polluting the error console seems to be acceptable. Everybody does it. Just leave the error console open while browsing the web to see how rampant the pollution is.

However I revisited this problem today. After extensive googling seeing all sorts of “solutions” that were similar to the above and which did not work I happened to find the following:

if (typeof(google) == ‘undefined’) {

I’m using Firefox 3.0.8 if this makes any difference. It’s the very latest version as of this month from Mozilla. I’ve got to remember this solution in the future!

Create a free website or blog at WordPress.com.