Animation on jekyll run github pages

1
votes

I have a little more complex question. I recently forked http://vis.supstat.com/ in order to set up a personal blog, which serves as a personal library with examples in R. In addition the blog is also a experiment to figure out the most efficient way to post from R mardown files locally created in RStudio to blog articles on a jekyll blog run on Github pages.

After I forked vistat on Github I changed the jekyll theme to hooligan (see https://github.com/dhulihan/hooligan) using

rake theme:install git="https://github.com/dhulihan/hooligan.git",

which worked out well, except the circumstance that all the animations were not shown anymore.

Let's get more precise:

The article on my blog about brownian motion (see http://magnusmetz.github.io/2012/11/brownian-motion-with-r/) is based on exactly the same *.Rmd file as the one on vistat (see http://vis.supstat.com/2012/11/brownian-motion-with-r/). In the version on my blog you will realize the animated graphic in the article is missing. Also the LaTeX expressions are shown incorrectly. If you compare the two source files on Github (see https://github.com/magnusmetz/magnusmetz.github.io/blob/master/_source/2012-11-06-brownian-motion-with-r.Rmd for my blog and https://github.com/supstat/vistat/blob/gh-pages/_source/2012-11-06-brownian-motion-with-r.Rmd for vistat) you will see that they are exactly the same. In both blogs the *.Rmd files have to be compiled using the script you can find in _bin/knit of each of the two blogs. The result is a markdown files, which is stored in _posts/ by the execution of the script with

./_bin/knit yyyy-mm-dd-name-of-the-script.Rmd through the terminal.

My question now is, why are the animations not shown at all in my blog and why are the LaTeX expressions shown incorrectly?

I already filed an issue to vistat (see https://github.com/supstat/vistat/issues/13) but with no results so far.

It really would be great, if somebody could help me to answer this question. Please don't hesitate to ask, if you need further information.

Thank you very much in advance for your answers.

2
ranimationjekyllgithub-pages

2 Answers

3
votes

If you look at the generated source on both the pages, you will find the key JS files, Mathjax.js and scianimator.js are missing.In the original repo they have been bundled in with the theme layout. So if you want to replace the theme, you would also need to include those javascript files to make it work.

0
votes

From

vistat/assets/themes/dinky/css

the files scianimator.blue.css, scianimator.css, scianiamator.dark.css and scianimator.light.css had to be copied to magnusmetz.github.io/assets/themes/dinky/css.

From

vistat/assets/themes/dinky/js

the files jquery.scianimator.min.js and scale.fix.js were copied to magnusmetz.github.io/assets/themes/dinky/js.

Subsequently the following codelines were added to magnusmetz.github.io/_includes/themes/hooligan/default.html:

<script src="{{ ASSET_PATH }}/js/scale.fix.js"></script>
{% if page.animation %}
<link rel="stylesheet" href="{{ ASSET_PATH }}/css/scianimator.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="{{ ASSET_PATH }}/js/jquery.scianimator.min.js"></script>
{% endif %}
<script src="https://c328740.ssl.cf1.rackcdn.com/mathjax/2.0-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
<script type="text/javascript">
MathJax.Hub.Config({
  tex2jax: {
    inlineMath: [['$','$'], ['\\(','\\)']],
    processEscapes: true
  }
});
</script>