The package does not work with the readtheorg-theme

[SimenHolmestad]

I really like the package and had a fun time creating my own special-block!

However, a problem I found after installing the package is that some of the interactivity of my html-exports are gone. I often use the readtheorg-theme from https://github.com/fniessen/org-html-themes, which can be enabled by adding

#+SETUPFILE: https://fniessen.github.io/org-html-themes/setup/theme-readtheorg.setup

to the top of an org file. After adding the org-special-block-extras package, the content-table at the left of the theme does not react when scrolling as it should do.

After examining the html-output of the org-file, the problem seems to be that the jQuery-library is loaded two times. Both by this package and from the readtheorg-setupfile.

Is there a way to change this package in a way so that this does not happen? 😊

[alhassy]

I'm glad to read that you've enjoyed the package ^_^

I've tried to reproduce your issue but could not do so.

• Using read-the-org with org-special-block-extras causes no problems for me.
• I can scroll both the left panel toc and the right panel contents.

I've looked into avoiding loading jQuery multiple times; it's a simple if-then-else check; but perhaps you could provide me with a minimal example of your issue.

All the best!

[SimenHolmestad]

Oh, I might have been a little unspecific describing the problem :) The cool stuff happening with the readtheorg-theme is not possible to see unless the document is of a certain length. I´ve exported a document with dummy text now, so you can see for yourself.

The version exported without org-special-block-extras: http://folk.ntnu.no/simehol/specialBlockExample/exportedWithoutSpecialBlocks.html

When I scroll in the browser I now get this effect:

The version exported with org-special-block-extras: http://folk.ntnu.no/simehol/specialBlockExample/exportedWithSpecialBlocks.html

Here the effect is gone :(

As you can see, the left panel headings does not expand to show subheadings when scrolling on the page which is exported with org-special-block-extras.

The org-file exported is provided in its entirety below:

:properties:
#+TITLE: This is a test
#+AUTHOR: Some Guy
#+EMAIL: some@guy.com
#+SETUPFILE: https://fniessen.github.io/org-html-themes/setup/theme-readtheorg.setup
:END:
* This is this first heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus id pharetra justo. Vestibulum euismod nulla sed purus varius consectetur. Donec porta hendrerit ex sit amet aliquet. Vestibulum bibendum suscipit posuere. Nunc quis posuere eros. Fusce et ultrices sem, nec pharetra urna. Mauris non ex eget nunc malesuada mattis in vitae neque. Donec id vehicula felis, interdum finibus quam.

Sed et ultricies arcu, vel efficitur lacus. Mauris facilisis, nisi a bibendum maximus, sem diam elementum urna, in varius leo lacus eu sem. Nullam bibendum elit eu purus venenatis dictum. Aliquam ornare non metus semper egestas. Nam consequat ante mi, non pretium dui auctor nec. Nunc ut quam est. Suspendisse volutpat orci non ipsum lobortis, eget aliquam mauris auctor.
** This is the first subheading of the first heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus id pharetra justo. Vestibulum euismod nulla sed purus varius consectetur. Donec porta hendrerit ex sit amet aliquet. Vestibulum bibendum suscipit posuere. Nunc quis posuere eros. Fusce et ultrices sem, nec pharetra urna. Mauris non ex eget nunc malesuada mattis in vitae neque. Donec id vehicula felis, interdum finibus quam.

Sed et ultricies arcu, vel efficitur lacus. Mauris facilisis, nisi a bibendum maximus, sem diam elementum urna, in varius leo lacus eu sem. Nullam bibendum elit eu purus venenatis dictum. Aliquam ornare non metus semper egestas. Nam consequat ante mi, non pretium dui auctor nec. Nunc ut quam est. Suspendisse volutpat orci non ipsum lobortis, eget aliquam mauris auctor.
** This is the second subheading of the second heading
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus id pharetra justo. Vestibulum euismod nulla sed purus varius consectetur. Donec porta hendrerit ex sit amet aliquet. Vestibulum bibendum suscipit posuere. Nunc quis posuere eros. Fusce et ultrices sem, nec pharetra urna. Mauris non ex eget nunc malesuada mattis in vitae neque. Donec id vehicula felis, interdum finibus quam.
* This is also a very informative heading
Sed tempor ex enim, facilisis imperdiet dolor finibus quis. Proin vehicula orci id posuere placerat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque hendrerit in eros eget mattis. Maecenas id blandit elit, ut tempor lectus. Pellentesque et turpis elit. Duis risus erat, porta in enim sit amet, finibus efficitur dolor.

$$ 1/2 = \frac{1}{2} $$
* This is heading number three
Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec pharetra augue sed maximus congue. Aliquam vestibulum, massa at malesuada malesuada, libero eros venenatis ipsum, non suscipit neque odio a ex. Ut a elementum sapien. In hac habitasse platea dictumst. Cras ante sem, gravida ut porttitor non, faucibus ac ligula. Pellentesque luctus laoreet ligula. Nullam in porta erat. Quisque lobortis massa ac lectus convallis efficitur.
** This subheding is nice
Sed tempor ex enim, facilisis imperdiet dolor finibus quis. Proin vehicula orci id posuere placerat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque hendrerit in eros eget mattis. Maecenas id blandit elit, ut tempor lectus. Pellentesque et turpis elit. Duis risus erat, porta in enim sit amet, finibus efficitur dolor.
*** Another subheading below here
Sed tempor ex enim, facilisis imperdiet dolor finibus quis. Proin vehicula orci id posuere placerat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque hendrerit in eros eget mattis. Maecenas id blandit elit, ut tempor lectus. Pellentesque et turpis elit. Duis risus erat, porta in enim sit amet, finibus efficitur dolor.
*** And yet another one
Sed tempor ex enim, facilisis imperdiet dolor finibus quis. Proin vehicula orci id posuere placerat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque hendrerit in eros eget mattis. Maecenas id blandit elit, ut tempor lectus. Pellentesque et turpis elit. Duis risus erat, porta in enim sit amet, finibus efficitur dolor.
* This is heading number four
Donec vestibulum auctor ante nec porta. Integer viverra scelerisque ex, vitae elementum tortor mattis lacinia. Praesent sodales laoreet dignissim. Integer tempor mollis diam, at aliquet turpis porta eu. Quisque vehicula molestie bibendum. Vestibulum eu dolor arcu. Aenean nec enim sed lacus tincidunt condimentum non quis metus. Praesent nec nisi id orci elementum fringilla. Mauris pellentesque vitae augue ut interdum. Integer dignissim eu urna ut sodales. Cras et sollicitudin mauris.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus id pharetra justo. Vestibulum euismod nulla sed purus varius consectetur. Donec porta hendrerit ex sit amet aliquet. Vestibulum bibendum suscipit posuere. Nunc quis posuere eros. Fusce et ultrices sem, nec pharetra urna. Mauris non ex eget nunc malesuada mattis in vitae neque. Donec id vehicula felis, interdum finibus quam.

Sed et ultricies arcu, vel efficitur lacus. Mauris facilisis, nisi a bibendum maximus, sem diam elementum urna, in varius leo lacus eu sem. Nullam bibendum elit eu purus venenatis dictum. Aliquam ornare non metus semper egestas. Nam consequat ante mi, non pretium dui auctor nec. Nunc ut quam est. Suspendisse volutpat orci non ipsum lobortis, eget aliquam mauris auctor.

Sed tempor ex enim, facilisis imperdiet dolor finibus quis. Proin vehicula orci id posuere placerat. Interdum et malesuada fames ac ante ipsum primis in faucibus. Pellentesque hendrerit in eros eget mattis. Maecenas id blandit elit, ut tempor lectus. Pellentesque et turpis elit. Duis risus erat, porta in enim sit amet, finibus efficitur dolor.

Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec pharetra augue sed maximus congue. Aliquam vestibulum, massa at malesuada malesuada, libero eros venenatis ipsum, non suscipit neque odio a ex. Ut a elementum sapien. In hac habitasse platea dictumst. Cras ante sem, gravida ut porttitor non, faucibus ac ligula. Pellentesque luctus laoreet ligula. Nullam in porta erat. Quisque lobortis massa ac lectus convallis efficitur.

Donec vestibulum auctor ante nec porta. Integer viverra scelerisque ex, vitae elementum tortor mattis lacinia. Praesent sodales laoreet dignissim. Integer tempor mollis diam, at aliquet turpis porta eu. Quisque vehicula molestie bibendum. Vestibulum eu dolor arcu. Aenean nec enim sed lacus tincidunt condimentum non quis metus. Praesent nec nisi id orci elementum fringilla. Mauris pellentesque vitae augue ut interdum. Integer dignissim eu urna ut sodales. Cras et sollicitudin mauris.

I hope that made the issue clearer :)

[alhassy]

Hey @SimenHolmestad, thanks for the MWE!

I've reproduced your issue and following your observation,

After examining the html-output of the org-file, the problem seems to be that the jQuery-library is loaded two times. Both by this package and from the readtheorg-setupfile.

I was able to fix the issue. I've pushed the fix, which you can either download manually or await the next MELPA build ---which may occur in a few hours.

Enjoy!