[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: |
Tue, 30 Nov 2010 21:27:42 +0100 |
User-agent: |
Gnus/5.13 (Gnus v5.13) Emacs/24.0.50 (gnu/linux) |
Hi Benny,
I found the code did not work for org-export, since user-defined
#+STYLE: stuff is inserted _before_ all the automatically created
javascript stuff.
So I had to fall back on a global value, to make the hooks work.
This is in the docs on http://orgmode.org/worg/code/org-info-js/#hooks
once the page is republished:
Currently two hooks are provided. Each hook function is called with
one or more parameters the first of which is the OrgHtmlManager
object.
- '~onReady~' :: This hook is run once the document is loaded, the
view is setup and the startup section is shown. The
second parameter is the first section shown, i.e. an
OrgNode object.
- '~onShowSection~' :: This one runs after showing a new section.
This hook is not called for the first section
shown. Use the '~onReady~' hook for the first
section. The second parameter is an object
with to OrgNodes: the previously shown section
and the current section.
To add functions to the hooks, fill a global object ~orgInfoHooks~
with the function objects you need. This is necessary, because code
added via the ~#+STYLE:~ option lines is executed before org-info.js
is loaded.
#+begin_src org
,#+STYLE: <script type="text/javascript">
,#+STYLE: /* <![CDATA[ */
,#+STYLE:
,#+STYLE: var f = function(){ alert("I'll be removed :("); };
,#+STYLE:
,#+STYLE: orgInfoHooks = {
,#+STYLE: 'onReady': [
,#+STYLE: function(ohm, sec){alert("I'm the only 'onReady' hook here.");}
,#+STYLE: ],
,#+STYLE: 'onShowSection': [
,#+STYLE: f,
,#+STYLE: function (ohm, secs) {
,#+STYLE: alert("You're looking at section "+secs['current']['I']+":\n"+
,#+STYLE: "\n <<<
"+ohm.rT(secs['current']['H']['innerHTML'])+" >>>");},
,#+STYLE: function(){
,#+STYLE: alert("I'll now remove my f and myself, too.");
,#+STYLE: org_html_manager.removeHook('onShowSection', f);
,#+STYLE: org_html_manager.removeHook('onShowSection',
,#+STYLE: orgInfoHooks['onShowSection'][
orgInfoHooks['onShowSection'].length - 1 ]);}
,#+STYLE: ]};
,#+STYLE: /* ]]> */
,#+STYLE: </script>
#+end_src
*Make sure to remove hook functions at the end of the hook*. Strange
things could happen otherwise (the hook loop will overlook a
member. While the hook loop runs in first hook first, the remove loop
removes the last hook first).
Your lightbox code would go in one of these hooks (you don't have to
supply all possible hooks):
orgInfoHooks = {
// Actions on startup, after org_html_manager is done:
'onReady': [
function (ohm) {
var root = ohm.R; // R is the root of the OrgNode tree.
var content = ohm.B; // B is the <div id="content">
...
// Run for the first section:
ohm.runHooks('onShowSection', { last: null, current: ohm.N });
}],
// Always, when the user navigates to a section:
'onShowSection': [
function (ohm, secs) {
// You could test for (secs.last == null) to know your
// called from the onReady hook.
// A better alternative would be, to define a separate
// function and call it from here and from onReady.
var previous = secs['last'];
var current = secs['current'];
if(current['F']) {
// sec.F is the div that holds the contents of the section
var imgs = sec.F.getElementsByTagName('img');
...
}}
]};
Let me know if you run into problems. Ideas welcome.
Sebastian