cloudhead/less.js — pull request #1167 by ich (2013-02-08 08:28:57+00:00)
Title: tree.URL::eval - Prevent adding rootpath multiple times

Intro.

I have 2 less files:

less/main.less
```less
@import "../sub/less/icon.less";
```
sub/less/icon.less
```less
.i-more {
background-image: url('../../sub/less/../img/ico/ico-triangle.png');
background-repeat: no-repeat;
}

.icon-more-black {
.i-more;

padding: 4px 0 0 7px;
background-position:0 0;
vertical-align: baseline;

&:hover{
background-position: -48px 0;
}
}

.icon-more-black-up {
.i-more;

padding: 6px 0 0 7px;
background-position: -24px 0;
vertical-align: middle;

&:hover{
background-position: -64px 0;
}
}

.icon-more-blue {
.i-more;

padding: 4px 0 0 7px;
background-position: -16px 0;
vertical-align: baseline;
}

.icon-more-gray {
.i-more;

padding: 4px 0 0 7px;
background-position: -8px 0;
vertical-align: baseline;

&:hover{
background-position: -56px 0;
}
}

.icon-more-gray-up {
.i-more;
padding: 6px 0 0 7px;
background-position: -40px 0;
vertical-align: middle;

&:hover{
background-position: -72px 0;
}
}
```

I set to true relativeUrls when compile main.less.

The result is:

```css
.i-more{background-image:url('../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;}
.icon-more-black{background-image:url('../sub/less/../sub/less/../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:4px 0 0 7px;background-position:0 0;vertical-align:baseline;}.icon-more-black:hover{background-position:-48px 0;}
.icon-more-black-up{background-image:url('../sub/less/../sub/less/../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:6px 0 0 7px;background-position:-24px 0;vertical-align:middle;}.icon-more-black-up:hover{background-position:-64px 0;}
.icon-more-blue{background-image:url('../sub/less/../sub/less/../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:4px 0 0 7px;background-position:-16px 0;vertical-align:baseline;}
.icon-more-gray{background-image:url('../sub/less/../sub/less/../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:4px 0 0 7px;background-position:-8px 0;vertical-align:baseline;}.icon-more-gray:hover{background-position:-56px 0;}
.icon-more-gray-up{background-image:url('../sub/less/../sub/less/../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:6px 0 0 7px;background-position:-40px 0;vertical-align:middle;}.icon-more-gray-up:hover{background-position:-72px 0;}
```

Take a look at .icon-more-black rule (others too). Multiple additions and background image url doesn't match .i-more.

So, I'd add some check. This:

```javascript
val.value = rootpath + val.value;
```

was replaced with:

```javascript
if (val.value.indexOf(rootpath) !== 0) {
val.value = rootpath + val.value;
}
```

This simple check - just check does val.value begin with rootpath or not. If rootpath is substring of val.value like "../../sub/less/../img/ico/ico-triangle.png" then val.value shall be prefixed with rootpath.

And the problem was solved:

```css
.i-more{background-image:url('../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;}
.icon-more-black{background-image:url('../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:4px 0 0 7px;background-position:0 0;vertical-align:baseline;}.icon-more-black:hover{background-position:-48px 0;}
.icon-more-black-up{background-image:url('../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:6px 0 0 7px;background-position:-24px 0;vertical-align:middle;}.icon-more-black-up:hover{background-position:-64px 0;}
.icon-more-blue{background-image:url('../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:4px 0 0 7px;background-position:-16px 0;vertical-align:baseline;}
.icon-more-gray{background-image:url('../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:4px 0 0 7px;background-position:-8px 0;vertical-align:baseline;}.icon-more-gray:hover{background-position:-56px 0;}
.icon-more-gray-up{background-image:url('../sub/less/../../sub/less/../img/ico/ico-triangle.png');background-repeat:no-repeat;padding:6px 0 0 7px;background-position:-40px 0;vertical-align:middle;}.icon-more-gray-up:hover{background-position:-72px 0;}
```

I think it's good edit. Thanks for less :) And please excuse me for my English if I'd made some mistakes.