01360: code box for pmwiki help pages (like HTML tag <code>)

Summary: code box for pmwiki help pages (like HTML tag <code>)
Created: 2014-12-25 00:53
Status: Closed, fixed for 2.2.71
Category: Bug
From: nikos?
Assigned:
Priority:
Version:
OS:

Description:

The problem:
In pmwiki documentation there are some examples of pmwiki code.
But these code strings are printed as normal text.
And when they are quite long, pmwiki introduces line breaks into them.
Then, when the reader copies the code, he also copies the line breaks that make the code non functional.
And not only that...
Along with the disfunctioning line breaks, there are line breaks that are, actually, part of the code. Therefor necessary.
So the user has to try all sorts of combinations to find out which of these line breaks are part of the code, and which ones break the code.
This is counterproductive, to say the list.

For example, check the " lfloat " in Images.

Possible solution:
A box for the code like in html tag <code>,
which will allow the reader to copy the code in its correct form.
See...
http://www.w3schools.com/tags/tag_code.asp

Does pmwiki already support this?
I did a lot of searches.
Couldn't find anything.

Of course this should not be just for pwiki.org,
but become part of pmwiki wikistyles, markup, or whatever.

nikos? December 25, 2014, at 12:56 AM

Confirmed. The only difficulty here is that the <code> tag does not display consecutive whitespaces which may also be important, but this can probably be overcome with CSS or with &nbsp; characters. Or by using the 'overflow' CSS property. --Petko December 25, 2014, at 05:03 AM


This comparison may demonstrate what I mean.

Compare A to B:

A.
While using pmwiki's [@SOME_CODE@] markup...
You will see that the line will become very long, and pmwiki's skin will expand.
If you use a skin with predefined width like Simple skin, the code will "run over the edge".

 
[@
 eeeeeeeeeeeeeeeeeeeeee e eeeeeeeeeeeeeeeeeeeeeeeeeee eeeeeeeeeeeeee eeeeeeeeeeeeeeeeeeeeee eeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee eeeeeeeeeeeeeeeeeeeeeeeeeeeee eeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee eeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee eeeeeeeeeeeeeeeeeeeeeeeeee 
@]

B.
Html <code> tag.
Copy the line with all the ees, above, and paste it after <body>, in the left box, in the following link.
http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_phrase_test
And... "see the results".
Although the lines, on the right box, might seem to have breaks, if you triple click on one of the eee words, you will select the entire eee string.
And of course, if you copy the entire body of code, and paste it on some text editor you will see that it is properly working.
That's a lot better!

nikos? December 25, 2014, at 01:18 AM

When someone needs to output preformatted text with the [@...@] markup, pmwiki must output it preformatted, with no inserted line breaks. Unless you define some CSS for the <pre> tag. For example, you can use the "overflow" property in pub/css/local.css:

  pre {
    max-width: 700px;
    max-height: 300px;
    overflow: auto;
    border: 1px solid #888;
 }

(I added this code to pub/css/PITS.01360.css to enable it on this page.)

The problem about how pre-formatted text appears in some skin needs to be discussed with the skin author. --Petko December 25, 2014, at 05:23 AM