managing image resources: where to put them so JS can always find them?

@mrhooMar 04.2008 — #I use relative urls in html, but I always use absolute urls in javascript. You never know where you are going to call a script from, but you do know where the resources are.

@sneakyimpauthorMar 04.2008 — #Isn't that a bit of a nightmare to maintain if you move something? Or suppose you want to use the JS on an entirely different site?

@mrhooMar 04.2008 — #That is why I use absolute urls.

Whenever I write a src or href or data attribute, or apply a background image url, I transform the pathname with a preface for the host and any level of the directory structure I'm located at.

image.src= Run.pathTrack('/art/clips/clip12.gif') will come out with the current host prefaced to the path. If I start the url with 'http://' it will get used as is.

It is not difficult, if you make a practice of converting every resource before you appy it.

I use these two methods in my scripts- the first is only used once, when a page opens, and the second is used whenever I set a file path

[CODE]findRoot:function(rootStr){
 var L= location.href;
 L= L.replace(/\/g,'/');
 var ax= rootStr? L.indexOf(rootStr): -1;
 ax= (ax== -1)? L.indexOf(location.pathname)+ 1: ax+ rootStr.length;
 return L.substring(0,ax);
 }[/CODE]

// Memry is a global, Memry.Rte uses the code above to set the protocol and host, (and a directory path in subdomains) as a preface to local urls.

[CODE]pathTrack:function(url){ 
 url= url.replace(/\/g,'/');
 if(url.indexOf(location.protocol)!=-1 || /^(mailto|http):/i.test(url)) return url;
 if(/^[!/]/.test(url)){
 return Memry.Rte + url.substring(1);
 }
 var Loc= location.href.replace(/\/g,'/');
 var ax= Loc.lastIndexOf('/');
 Loc= Loc.substring(0,ax);
 var L= Memry.Rte.length;
 while (/^..//.test(url)){
 if(ax< L) return '';
 ax= Loc.lastIndexOf('/');
 Loc= Loc.substring(0, ax);
 url= url.substring(3);
 }
 return Loc + '/' + url;
 }[/CODE]

managing image resources: where to put them so JS can always find them?

3 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

managing image resources: where to put them so JS can always find them?

3 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

3 Comments(s) _↴

Also in #JavaScript _↴