Question

I’ve inherited some pretty complex code for a web forum, and one of the features I’m trying to implement is the ability for spaces to not be truncated into only one. This is mainly because our users often want to include ASCII art, tables etc in their posts.

I first did this using a simple search and replace in javascript, which had the side effect of breaking HTML tags (eg <a href=....> became <a&nbsp;href=.....>).

I then tried doing this on server side, when the strings are retrieved, by having spaces converted before links and code people insert is converted to HTML. This works to a degree but it causes some issues with other parts of the code, for example where a message is truncated to appear on the home page, it might leave some of the space code, such as

Here is a message&nb

I think there may be a way to just alter the original javascript to achieve this – it just needs to only match spaces that are not inside a HTML tag.

The script I was using originally was message = message.replace(/\s/g, " ").

Thanks for any help you can provide with this.

Answer 1

You can use the pre element to include preformatted text, which renders spaces as-is. See http://www.w3.org/TR/html5-author/the-pre-element.html

Those docs specifically say one of the best uses of the pre element is “Displaying ASCII art”.

Example: http://jsbin.com/owuruz/edit#preview

<pre>
         /\_/\
    ____/ o o \
  /~____  =ø= /
 (______)__m_m)
</pre>

In your case, just put your message inside a pre tag.