Re: Change default style sheet: add line numbers
by BrowserUk (Patriarch) on Mar 28, 2015 at 14:48 UTC
|
Thanks for pointing this out. 12+ years here and I didn't know it existed. (And thanks to LanX for discovering the details.)
One possible change would be to have it respect the same lines limit as the download link, to prevent line numbers appearing on short code blocks.
Also, if they appeared a (slightly) different color to the data, it would stop them looking like a part of it. (Perhaps this can be done with css?)
See Perl's bad at arithmetic? for an example of both effects on short code blocks.
With the rise and rise of 'Social' network sites: 'Computers are making people easier to use everyday'
Examine what is said, not who speaks -- Silence betokens consent -- Love the truth but pardon error.
| [reply] [Watch: Dir/Any] |
Re: Change default style sheet: add line numbers
by LanX (Saint) on Mar 28, 2015 at 19:33 UTC
|
RFC! A two-column table design to separate numbers from code. :)
01
02
03
04
05
06
07
08
09
10
| $obj = MyDyn->new(id => 'MyObj');
print $obj->id, "\n";
$obj->action();
package MyDyn;
use base 'DynObject';
sub action
{
print "hi\n";
}
|
update
inspired by Re^5: Change default style sheet: add line numbers
Some remarks:
- line-numbers are not always in sync, line-height of { or $ may interfere (depending on CSS, YMMV)
- numbers shouldn't be real code section (no download-link) but mimic the css settings
- JS toggle could interactively hide numbers
- wrapped-over lines must not be counted
- this could also be realized as nodelet hack
- line numbers could be anchors for html-links generated from error message
- line-numbers could be only shown on_mouse_over, else hidden
| [reply] [Watch: Dir/Any] [d/l] [select] |
Re: Change default style sheet: add line numbers
by LanX (Saint) on Mar 28, 2015 at 14:17 UTC
|
| [reply] [Watch: Dir/Any] |
|
I have line numbers turned on, but they aren't selected when I copy the code. But I might have forgotten putting some JS to a nodelet or similar.
| [reply] [Watch: Dir/Any] |
|
| [reply] [Watch: Dir/Any] |
|
|
|
This would block C&P without clicking on DOWNLOAD, that's why many would object. But an interactive JS toggle might solve that.
Hmm , firefox doesn't copy/paste line numbers ... so I don't think JS is required
#!/usr/bin/perl --
use strict;
use warnings;
print "Hello
+ world!\n";
| [reply] [Watch: Dir/Any] [d/l] |
Re: Change default style sheet: add line numbers
by roboticus (Chancellor) on Apr 04, 2015 at 13:26 UTC
|
After learning a lot about style sheets from reading this thread, and by combining various ideas throughout the thread, and quite a bit of cut-and-try, I finally have some CSS-only settings that work for me*, so here's what I have:
In Display Settings / Code Listing Settings I have two bits:
I'm pretty happy with the result, as I can still have my line numbers and no longer have the line numbers come through on cut-and-paste.
I originally had (cadged from Anonymous Monk in this post) div.codeblock in the counter reset list, but that had the unfortunate effect of making small codeblocks (ones without the download link) all have the same line number). (While I learned more about CSS, I didn't learn enough about know/explain why.)
Anyway, if people could try it on other browsers & such, I'd appreciate it. (I'll give MacOsX / safari & chrome a try when I get back to $work on Monday).
*: I'm using Microsoft Windows 8.1 and FireFox 35.0.1 as I'm testing today.
Update: By the way, I've tried to fix the line-wrap by replacing the content like so:
span.line-break { content: '' }
but it doesn't hide the line wrap marker. Considering that I'd often hand-edit to remove a few line numbers (when I only wanted a section of the OP), it's no big deal. If it becomes bothersome, I can always turn off line wrapping.
...roboticus
When your only tool is a hammer, all problems look like your thumb. | [reply] [Watch: Dir/Any] [d/l] [select] |
|
| [reply] [Watch: Dir/Any] |
|
For me all lines are numbered with 01:
Netscape
Mozilla/5.0 (X11; Ubuntu; Linux i686; rv:37.0) Gecko/20100101 Firefox/
+37.0
Since I couldn't guaranty that other settings aren't interfering (there are plenty after 7 years) I tried an alternative account and now it worked for me in FF.
Though testing on Safari/Android didn't show any numbers, but red source code... ¹
Consequence, CSS tricks are fragile and can easily interfere with other settings.
More elementary approaches like demonstrated in Metacpan or perlcommunity.de OTOH are well tested already.
¹) UPDATE: I was able to fix this, but line-breaks are still lost after copying! | [reply] [Watch: Dir/Any] [d/l] [select] |
|
More elementary approaches like demonstrated in Metacpan or perlcommunity.de OTOH are well tested already.
Well the perlcommunity.de solution isn't bulletproof, it won't work well with wrapping or font customizations, the line numbers will get out of sync with the code
the metacpan solution is javascript
| [reply] [Watch: Dir/Any] |
|
|
I originally had (cadged from Anonymous Monk in this post) div.codeblock in the counter reset list, but that had the unfortunate effect of making small codeblocks (ones without the download link) all have the same line number). (While I learned more about CSS, I didn't learn enough about know/explain why.) Thats odd, the one liners are class inlinecode not codetext , but this should work as well and not need font tags
pre.code div.codeblock tt.codetext
{ counter-reset: codeLineCounter; }
pre.code div.codeblock tt.codetext i::before
{ counter-increment: codeLineCounter;
content: counter(codeLineCounter,decimal-leading-zero) ": ";
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
float: left;
width: 3em;
text-align: right;
color: purple; }
And I think that user-select: none; stuff might work with the regular "code prefix" line numbers feature
I can always turn off line wrapping.
Why don't you turn on soft-hyphen line wrapping? I think that select: none; might help with the soft-hyphen not being copy/pasted | [reply] [Watch: Dir/Any] [d/l] [select] |
|
.unselectable, .line-breaker {
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none; }
| [reply] [Watch: Dir/Any] [d/l] |
Re: Change default style sheet: add line numbers
by jeffa (Bishop) on Mar 28, 2015 at 20:39 UTC
|
There is a reason why "we coders" got away from line numbers, they change often. If someone gives us large chunks of code they don't understand, presenting line numbers is going to encourage them to continue to think in large chunks ... line numbers are not going encourage Seekers to clean their rooms.
My opinion is that this is just adding more features that some us don't even want. Why complicate things when it just enables bad habits to persist?
UPDATE:
"Well, your own blog displays code with line numbers."
Yes. And i didn't really like it. What a weak argument. A strong argument would be how Github uses them. But when it comes to merging code, the VCS needs that information. Again, it's information that is better suited for computers (robots) than humans. Petty arguments aside, The bottom line is i would prefer for such to not be a default here.
jeffa
L-LL-L--L-LL-L--L-LL-L--
-R--R-RR-R--R-RR-R--R-RR
B--B--B--B--B--B--B--B--
H---H---H---H---H---H---
(the triplet paradiddle with high-hat)
| [reply] [Watch: Dir/Any] [d/l] [select] |
|
> There is a reason why "we coders" got away from line numbers
> Why complicate things when it just enables bad habits to persist?
Well, your own blog displays code with line numbers.
| [reply] [Watch: Dir/Any] |
Re: Change default style sheet: add line numbers
by chacham (Prior) on Mar 30, 2015 at 14:25 UTC
|
add line numbers to code listings
This certainly sounds like a nice option, but i wonder how much it would actually help. First we need an errors message that refers to line numbers, and then we'll need to make sure it was posted as written. Saying this would encourage people to then post those error messages does indeed sound enticing, though perhaps too optimistic.
Personally, i think the option would be a nice aesthetic addition. Though, whether the option is based on the poster on the reader is debatable. Personally, i vote for the latter.
A ridiculous side note: Wouldn't that limit code length? I mean, "your lines are numbered <evil laugh>" :)
| [reply] [Watch: Dir/Any] |
|
I agree that the effect on new posters is not really predictable. (IMHO there are other possible measures that may have far more impact)
But for someone trying to read and answer on longer code, line numbers could be very helpful.
> we'll need to make sure it was posted as written
well this could be fixed with an optional start-offset.
| [reply] [Watch: Dir/Any] |
|
>But for someone trying to read and answer on longer code, line numbers could be very helpful.
Agreed. Though this begs the question: How often do you think this comes up? That is, that a code listing was "long enough" that you had wished there were provided line numbers?
| [reply] [Watch: Dir/Any] |
|
|
Re: Change default style sheet: add line numbers (code)
by Anonymous Monk on Apr 01, 2015 at 11:04 UTC
|
I suggest that the default style sheet be changed to add line numbers to code listings. I've had that set up on my style sheet for quite some time now, and find it pretty convenient. Can you show us this code?
| [reply] [Watch: Dir/Any] |
|
Certainly! In the Display Settings page, the Code Listing Settings box has a field called "Code Prefix". In that box I have "<b><font color="red">&01;</font></b></p> ". I like the line numbers to stand out, so I put 'em in red. The &01; bit tells PM to "put line number here".
Just in case anyone is interested (and for future reference), some other settings I'm using are:
- General site purtifications
Display Settings / Theme Configuration / Theme Container: Perl-Blue Theme
- Keep vote button at UL corner of screen
Display Settings / Style Sheet Settings / On-Site CSS Markup:
input[name="sexisgreat"] {
position: fixed;
top: 0px;
left: 0px;
z-index:1;
padding: 5px;
border: 4px solid red;
}
- Make "readmore" stuff obvious
Display Settings / Theme Configuration / Style Sheet Settings / On-Site CSS Markup:
div.readmore { background-color: inherit;
padding-left: 4px;
border-left-width: 5px;
border-left-color: #00ff00;
border-left-style: solid;
margin-left: -9px;
}
- Put the "I've Checked all these" button in the UL corner
Display Settings / Style Sheet Settings / On-Site CSS Markup:
input[name="viewedNewNodes"] {
position: fixed;
top: 0px;
left: 0px;
z-index:1;
padding: 5px;
border: 4px solid green;
}
- Make signatures stand out a bit
Display Settings / Style Sheet Settings / On-Site CSS Markup:
pmsig { background: #ff4040; }
- I don't recall what this does for me
It looks like I wanted preformatted text to wrap, but I've seen no evidence that it does that. But it might be doing something that I don't know about, otherwise, why would I have left it in? ;^D
Display Settings / Style Sheet Settings / On-Site CSS Markup:
pre { white-space: pre-wrap; }
- Make certain monk's names prominent
The first one is me, the next is the normal template I use. I change the background color for different groups of monks. Groups like "asks interesting questions", "makes amusing comments" and whatnot. IIRC, there's a way to ignore monks this way, but I forgot what it is, as I'm not using it.
Display Settings / Style Sheet Settings / On-Site CSS Markup:
.user-533863 { background: #CCFFCC; font-weight: bold }
.user-###### { background: #FFCCCC; }
- Computer-specific settings (like for $work or various home boxes
Display Settings / Style Sheet Settings / Link to External CSS stylesheet:
file:///path/used/on/all/my/computers/PM.css
None of this stuff is original, I've heard references on the chatterbox or noticed interesting nodes that provided these tips. I used to use a code formatter/syntax colorizer like the one tobyink references, but I abandoned that a few years ago when it went wonky on me and made page rendering take forever and a day.
Update: A few formatting tweaks I didn't notice before I clicked "create".
...roboticus
When your only tool is a hammer, all problems look like your thumb.
| [reply] [Watch: Dir/Any] [d/l] [select] |
|
> <b><font color="red">&01;</font></b></p>
Hm. .. I ignored that HTML tags could be injected too.
Enclosing line numbers in a span which is hidden by a onselect JS handler could be a solution for unintended selection.
Unfortunately no time for a prove of concept now.
FWIW, the source view in metacpan is pretty neat, no selection of line numbers and syntax highlighting.
Couldn't check yet how highlighting is implemented. ¹
¹) looks Perltidy'ish
| [reply] [Watch: Dir/Any] [d/l] |
|
So your proposal has nothing to do with the default style sheet? Which is CSS?
| [reply] [Watch: Dir/Any] |
|
|
|
|
| [reply] [Watch: Dir/Any] |
|
choroba, how do you know this is what roboticus is using in a css stylesheet? Thats quite a bit of javascript that isn't CSS
| [reply] [Watch: Dir/Any] |