Hi. Just an idea for a convenience hack:
How about an <update> tag?
When updating a node, one would only add the new text
between <update> tags and
the PM-Script-o-Matic
would render the content as demonstrated below.
Even the time of an update could be entered automatically
- if that is considered useful.
The examples below
display the timestamp as a tool-tip, but it shouldn't
be too difficult to make a timestamp more prominent, i.e. by
means of the same mechanism that is used to show/hide Monk levels (.attribution-title).
Additionally, I also changed the demo-styles
for <ins> (markup for inserted text)
and <del> (markup for deleted text) that
can be used independently from the <update> tag
but also belong to the change marks category.
Pros:
- Less typing. Adds markup and a timestamp.
- Allows individually configurable uniform appearance.
- Backward compatible.
- Makes update explicit - could be used by Super Search?
- Not mandatory. TIMTOWTDI
- Open to add further attributes to <update>.
- No client configuration required.
- ...
Cons:
- Higher load on PM machines (not much, I guess).
- Current themes (9-10) must be patched, but at least
common.css (add four lines .update-*).
- Multiple updates: Need to preserve timestamps? Need an enumerator?
- Bug or feature? Seems that the title attribute is removed from <div> tags by PM?
See source code of Variant#4 below for an alternate template.
- ...
I.e., entering this ...
<update>
Some new paragraphs.
</update>
<update>Some new inline text.</update>
... will be expanded into this:
<div class="update-block" title="Mar 01, 2009 at 16:20 CET">
<div class="update-tag">Update</div>
<div class="update-body">
Some new paragraphs.
</div>
</div>
<span class="update-inline" title="Mar 01, 2009 at 16:20 CET">
<span class="update-tag">Update:</span>
Some new inline text.
</span>
So much for the HTML translation.
Fortunately, the PM themes cannot be overruled easily, but
unfortunately this means that you need to append the
lines below to your personal CSS configuration if you like
to see the rendered output. The style definitions should not conflict with existing or future themes (although they might cause eye damage).
The styles below provide some examples suitable for
PM themes with a light background (preferably Perl-Blue).
A real style would have four or five lines only (.update-[block|inline|tag|body|stamp]).
I hope not to have broken too many CSS/HTML/Latin rules ;-)
Thanks.
Update
Clarification/Summary: The
<update> tag was intended to visualise a significant change of a
node if the author decides so. At the same time, the reader shall have an opportunity to render this update
according to his/her needs. It was not intended to replace or wrap any
<ins> / <del> tags in
<update> blocks.
Longer explanation...
Examples
(*) Important:
In order to see (or tweak) these demo-layout variants, you must find the
«On-Site CSS Markup»
- section
in your personal Display Settings
and temporarily append the following lines:
/* UPDATE (document -> update-block -> update-tag -> update-body)*/
/* Sample CSS suitable for PM themes with light background,
e.g. "Perl-Blue Theme" (my default) or "Red Theme".
"Dark" themes need further tweaking.
*/
/* Update-Variant 1: sparse markup */
.del1 { color: #888; text-decoration: line-through; }
.ins1 { color: #006; text-decoration: none; }
.update-block1 { margin: 0.5em 0.5em; text-align: left; }
.update-inline1{ margin: 0.5em 0.5em; text-align: left; }
.update-tag1 { text-indent: 0.2em; font-weight: bold; }
.update-body1 { margin: 0em 0em 0em 2em; }
/* Update-Variant 2: moderate / invisible deletions */
.del2 { display: none; }
.ins2 { color: #006; text-decoration: none; }
.update-block2 { margin: 0.5em 0.5em; text-align: left; }
.update-inline2{ margin: 0.5em 0.5em; text-align: left;
font-style: italic;}
.update-tag2 { text-indent: 0.2em; font-weight: bold; }
.update-body2 { margin:0em 0em 0em 2em; }
/* Update-Variant 3: plz hurt my eyes (nice with: Perl Blue Theme) */
.del3 { color: #888; text-decoration: line-through; }
.ins3 { color: #00a; text-decoration: none; }
.update-block3 { margin: 0.5em 0em 0.5em; text-align: left;
background: #eeeeff; border: 1px solid #069; }
.update-inline3{ margin: 0.5em 0em 0.5em; text-align: left;
background: #eeeeff; border: 1px solid #069; }
.update-tag3 { text-indent: 0.2em; font-weight: bold;
background: #069; color:#fff;
font-variant: small-caps; }
.update-body3 { margin: 0em 0em 0em 2em; }
/* in case the 'title' attribute is removed from '<div>' tags: */
.update-stamp3 { font-size: smaller; font-variant: normal; }
/* ------------------------------------------------------------- */
Variant 0: No CSS changes
... Aenean commodo ligula eget dolor.
Update: Perlum rulec! Nullam quis ante.
Update
Aenean massa. Cum sociis rubium perlum penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Nullam dictum felis eu pede mollis pretium. Cras dapibus.
Integer
rhoncus tincidunt. ...
Variant 1 - Moderate Markup
(*)
... Aenean commodo ligula eget dolor.
Update: Perlum rulec! Nullam quis ante.
Update
Aenean massa. Cum sociis rubium perlum penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Nullam dictum felis eu pede mollis pretium. Cras dapibus.
Integer
rhoncus tincidunt. ...
Variant 2 - Moderate Markup / invisible deletions
(*)
... Aenean commodo ligula eget dolor.
Update: Perlum rulec! Nullam quis ante.
Update
Aenean massa. Cum sociis rubium perlum penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Nullam dictum felis eu pede mollis pretium. Cras dapibus.
Integer
rhoncus tincidunt. ...
Variant 3 - Heavy Markup
(*)
... Aenean commodo ligula eget dolor.
Update: Perlum rulec! Nullam quis ante.
Update
Aenean massa. Cum sociis rubium perlum penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Nullam dictum felis eu pede mollis pretium. Cras dapibus.
Integer
rhoncus tincidunt. ...
Variant 4 - Heavy Markup with 'title' Workaround
(*)
... Aenean commodo ligula eget dolor.
Update: Perlum rulec! Nullam quis ante.
Update (Mar 01, 2009 at 16:20 CET)
Aenean massa. Cum sociis rubium perlum penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Nullam dictum felis eu pede mollis pretium. Cras dapibus.
Integer
rhoncus tincidunt. ...
Tested under Linux with Opera 9.63, Firefox 3.0.6, and Konqueror 4.1.3 - but it should work with all modern browser/OS combinations.
Posts are HTML formatted. Put <p> </p> tags around your paragraphs. Put <code> </code> tags around your code and data!
Titles consisting of a single word are discouraged, and in most cases are disallowed outright.
Read Where should I post X? if you're not absolutely sure you're posting in the right place.
Please read these before you post! —
Posts may use any of the Perl Monks Approved HTML tags:
- a, abbr, b, big, blockquote, br, caption, center, col, colgroup, dd, del, details, div, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, ins, li, ol, p, pre, readmore, small, span, spoiler, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, tr, tt, u, ul, wbr
You may need to use entities for some characters, as follows. (Exception: Within code tags, you can put the characters literally.)
| |
For: |
|
Use: |
| & | | & |
| < | | < |
| > | | > |
| [ | | [ |
| ] | | ] |
Link using PerlMonks shortcuts! What shortcuts can I use for linking?
See Writeup Formatting Tips and other pages linked from there for more info.