OctoPrint-Dashboard icon indicating copy to clipboard operation
OctoPrint-Dashboard copied to clipboard

ellipsis for long file names

Open vajonam opened this issue 3 years ago • 3 comments

is it possible to add ellipsis to long file names. I can provide a PR if you like.

image

Here is a solution you can use https://stackoverflow.com/questions/831552/ellipsis-in-the-middle-of-a-text-mac-style

This looks like a function that will work.

function smartTrim(string, maxLength) {
    if (!string) return string;
    if (maxLength < 1) return string;
    if (string.length <= maxLength) return string;
    if (maxLength == 1) return string.substring(0,1) + '...';

    var midpoint = Math.ceil(string.length / 2);
    var toremove = string.length - maxLength;
    var lstrip = Math.ceil(toremove/2);
    var rstrip = toremove - lstrip;
    return string.substring(0, midpoint-lstrip) + '...' 
    + string.substring(midpoint+rstrip);
}   

vajonam avatar Nov 06 '21 15:11 vajonam

huh, I thought we already had this, will have to check

j7126 avatar Nov 06 '21 20:11 j7126

I think this should be done via css text-overflow: ellipsis; so it dynamically adjusts the length when resized.

Fredyy90 avatar Nov 07 '21 06:11 Fredyy90

I think this should be done via css text-overflow: ellipsis; so it dynamically adjusts the length when resized.

But this puts the ellipsis at the end of the text not in the middle. Guess could argue that file name will always end with .gcode so but there might other stuff before that's more identifiable.

vajonam avatar Nov 07 '21 12:11 vajonam