OJS 3.2.1.1 - Long file names "break" the interface

It seems that in when file names are too long and don’t have spaces, it “breaks” the interface:

image

It’s a simple fix; all it needs to be done is rename the file, either make it short or use actual spaces instead of underscores or hyphens, but it can cause confusion for less experienced users and make them think the submission is “stuck” as it covers the decision buttons (not visible in this case as it was a test submission that already had a decision).

Thanks!

Hi @Carolina_Tanigushi,

Thanks for sharing. I’m sure that would cause some editors to shed a few tears when they see a file name that length. There has been some recent work done in File uploads: https://github.com/pkp/pkp-lib/issues/6057 as part of the work for OJS 3.3. I just tested this in 3.3.0-5 and noticed that it is handled differently: if there is a really long file name it gets cut off at a certain point and doesn’t extend past the text area like it does in your example.

Screen Shot 2021-04-30 at 8.01.25 AM

I’m not sure if this would warrant applying this change in OJS 3.2 and how feasible that would be - I may ask @NateWr to weigh in on this, since he was involved in some of the refactoring work around file uploads for 3.3.

-Roger
PKP Team

Hi, @rcgillis

Thank you for getting back to me!

Though I’m not sure if it’s been fixed for the specific case I mentioned looking at your test… In my test the file name didn’t have any spaces, only the underscores, so something like: file_with_a_really_really_really_really_really_really_really_really_really_really_really_really_really_really_really_reall.docx.

If I try replicating it as you did (file_with_a_really_really really_really really_really really_really really_really long_name) as there are spaces between the words, the line breaks:

image

Hi @Carolina_Tanigushi,

Ah - thanks for clarifying. I think I missed the distinction with the lack of spaces. I did test this again in 3.3.0-5, and it does indeed do the same thing as you are experiencing.

Screen Shot 2021-04-30 at 9.26.46 AM

I did tinker with the CSS in my browser dev tools and found that applying: word-wrap: break-word; to that particular <a> tag that contains that file name does wrap the text (although it cuts off the full-title and doesn’t allow it to be fully displayed:

Screen Shot 2021-04-30 at 9.32.07 AM

Although, applying this in the CSS file is tricky, because that particular anchor tag doesn’t have a class or ID associated with it. So, I think I would still like Nate to weigh in when he has a chance to suggest how this might be best handled.

-Roger
PKP Team

1 Like

Hi @Carolina_Tanigushi, the same issue (but in a different place) is filed at Long filenames with no spaces push content off of editorial history modal · Issue #5836 · pkp/pkp-lib · GitHub but we haven’t yet had the time to sort it out.

1 Like