Reduce File Name
HTML
<div id="test1" class="test">thisisareallylongfilenamethathastobecut.jpg</div>
<div id="test2" class="test">iamshort.jpg</div>
<div id="test3" class="test">ihavelotsof.periods.in.my.name.jpeg</div>
<div id="output"></div>
CSS
#output{
width: 500px;
background: #ffb;
padding: 10px;
border: 2px solid #999;
}
.success{
color: green;
}
.failure{
color: red;
}
JavaScript
$(function() {
$('.test').each(function() {
var output = $('#output');
var name = $(this).html();
var max = 20;
output.append('<b>Original: </b>' + name + '<br/>');
output.append('<b>Original Length: </b>' + name.length + '<br/>');
output.append('<b>Max: </b>' + max + '<br/>');
var result = ReduceFileName(name, max);
output.append('<b>final: </b><span class="' + (result.length == max|| name.length < max ? "success": "failure") +'">' + result+ '</span><br/>');
output.append('<b>final length:</b> ' + result.length + '<hr/>');
$(this).html('');
});
});
function ReduceFileName(name, max){
if(name.length > max){
var end = name.substring(name.lastIndexOf('.'));
var begin = name.substring(0, name.lastIndexOf('.'));
max = max - end.length - 3;
begin = begin.substr(0,max/2) + '...' + begin.substr(begin.length-(max/2) , max/2 + 1);
return begin + end;
}
return name;
}