[Top][All Lists]
[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
Re: [Orgmode] Re: Highlight current page in TOC
From: |
Sebastian Rose |
Subject: |
Re: [Orgmode] Re: Highlight current page in TOC |
Date: |
Wed, 24 Nov 2010 20:00:03 +0100 |
User-agent: |
Gnus/5.13 (Gnus v5.13) Emacs/24.0.50 (gnu/linux) |
Sebastian Rose <address@hidden> writes:
> Benny Simonsen <address@hidden> writes:
>
>> 2010/11/14 Benny Simonsen <address@hidden>
>>>
>>> Hi
>>>
>>> With the org-info-js mode enabled each section is shown as a seperate
>>> page, but then I would like to get current page marked in the TOC in
>>> some way (e.g. class=current and then some CSS to make the markup)
>>> ... but is it possible?
>>>
>>> /Benny
>>
>> Hi
>>
>> I have made it.
>>
>> The result can be seen on a example page I have made (in danish -
>> (translated org-info-src.js [1] it into danish)) -
>> http://slbs.dk/org/oensker.html
>>
>> I have modified org-info-src.js [1] to include an extra function
>> setLinkClass + using this function at the end of showSection.
>> I have also added a small css script [2] with the extra content, which
>> could be included in the normal worg.css [3] without side effects, I
>> think.
>> I include one css - main.css [4] that includes the two css files
>> mentioed here + an extra file with my own site style.'
>>
>> Except the changes in my site slbs.css, the only style changes I have made
>> are:
>> - Current page/section are marked black and bold
>> - Visited pages are marked in different color
>>
>> Anyone interested in a patch for the highlighting of the links?
>> Anyone interested in a patch for the danish org-info-src.js?
>>
>> [1] http://slbs.dk/org/scripts/org-info-src.marklinks.js
>> ... in danish: http://slbs.dk/org/scripts/org-info-src.da.marklinks.js
>> ... in danish without modifications:
>> http://slbs.dk/org/scripts/org-info-src.da.js
>> [2] http://slbs.dk/org/style/marklink.css
>> [3] Copy from http://orgmode.org/worg/worg.css
>> [4] http://slbs.dk/org/style/main.css - Which includes the other css files
>>
>> I have also included lightbox-2.04, and changed it so that a group is
>> limited to one visible page(one section)
>>
>>
>> Best regards
>> Benny Simonsen
>
>
> Hi Benny!
>
>
> That's very beautiful with fixed T.O.C!
>
>
> I have added a modified version of your patch (just the "className" part
> of it).
>
> The sections now reference their anchor HTML-Element in the TOC passed
> as an additional parameter in the constructor OrgNode (in the function
> `mkNodeFromHref()'). This might lead to problems in old Internet
> Explorers when leaving the page - but in old ones.
>
>
>
> I guess the cleanest way to add actions to org-info.js is to add hooks
> and use them this way (e.g. in the HTML <head> section):
>
>
> #+STYLE: <script type="text/javascript">
> #+STYLE: org_html_manager.onReady(
> #+STYLE: function(){alert("Page is loaded, setup finished.");});
> #+STYLE: org_html_manager.onShowSection(
> #+STYLE: function(sec){alert(sec.H);});
> #+STYLE: </script>
>
>
> That's what I'm working at currently:
>
> Just gimme an hour. You can then hook in your LightBox function.
>
> Note: currently the names in sources and compressed scripts are
> different (see `sed.txt'). We should change that in the future for
> some widely used variables (like OrgNode.H <=> OrgNode.HEADING).
OK. That's how it works now:
There are two hooks (maybe more to come) for now.
1. The 'onReady' hook.
You may add functions to that hook using
#+STYLE: <script type="text/javascript">
#+STYLE: org_html_manager.onReady(function(){alert("Ready");});
#+STYLE: </script>
The hook is called with exactly one parameter: the OrgHtmlManager
object (which is the first parameter for every hook function).
2. The 'onShowSection' hook.
You may add functions to that hook using
#+STYLE: <script type="text/javascript">
#+STYLE: org_html_manager.onShowSection(function(ohm, obj){
#+STYLE: alert("Showing "+ohm.rT(obj.current.H.innerHTML));
#+STYLE: });
#+STYLE: </script>
The hook is called with two parameters: the OrgHtmlManager
object (which is the first parameter for every hook function) and an
object
{last: OrgNodeObject, current: OrgNodeObject}
You may add several functions to a hook by calling the `onReady' method
several times. Fist added, first executed.
So you would just add your LightBox stuff like this (untested):
org_html_manager.onShowSection(function(ohm, secs)
{
var imgs = secs.current.D.getElementsByTagName("img");
for(var i=0;i<imgs.length;++i) {
if(imgs[i].parentNode.tagName == "A" && imgs[i].parentNode.rel ==
"lightboxGrp") {
parent = imgs[i].parentNode.parentNode;
div_id = "";
do {
if(parent.tagName == "BODY") {
div_id = "NaN_body";
}
else if(parent.tagName == "DIV" && parent.className ==
"outline-text-2") {
div_id = parent.id;
}
else {
nxtParent = parent.parentNode;
parent = nxtParent;
}
} while (div_id == "");
imgs[i].parentNode.rel = "lightbox["+div_id+"]";
}
}
Best wishes
Sebastian