How to config MathJax for reveal.js when running offline? - mathjax

In the reveal.js documentation, the MathJax section says that normally, MathJax is loaded from a remote server, and if you want to use MathJax offline you'll need to download a copy of the library and adjust the mathjax configuration value.
The configuration I'm trying is
math: {
mathjax: 'MathJax/MathJax.js',
config: 'TeX-AMS_HTML-full'
}
where MathJax/MathJax.js is the relative address of the MathJax.js file in a clone of the MathJax repository I have locally on my computer.
When I first load a page in the presentation with equations on it (or reload it by pressing F5 in the browser), I first see the LaTeX code for the equations for a short while, before seeing a rendering that looks very basic and not very nice but still okay, but then finally I see what looks like a nice rendering of the equations, but with thick frames around every character in the equations which completely mess up everything.
How should MathJax be configured properly, so that it looks identical to when MathJax is loaded from a remote server?

Related

How to watch changes to compiled CSS and update original SCSS?

I know it sounds ridiculous, but Chrome writes to the compiled CSS when using the Developer Tools -> Elements -> Styles with workspace set up. It sees the original partial, but when changing a property, it writes to the compiled (they say it's working as intended, lol). Therefore I would like to:
Watch or intercept 3rd party writes to compiled (changes that didn't occur from the compile due to regular --watch).
Map the change using the sourcemap to the original SCSS file.
Save the changed SCSS file.
That will trigger a new compile. The compiled CSS will probably be the same as how Chrome left it. But this time the values arrive from SCSS and will persist.
I know that if I change stuff on the Sources tab, it does save to the right file. But I don't get a live preview then playing directly with the SCSS file on the Sources tab, only if I save. My workflow includes changing the design live on the Elements -> Style tab, then (for now) copy pasting the values I like to the file. If I have to switch to the Sources tab and I see the unchanged original values there (paste the changes, save, refresh), I might as well just switch to VS Code to do the same thing, it defeats the purpose of how it should work (when no SCSS is thrown into the mix).
I'm using sass from npm but I see this reverse sync would be the task of a custom script that can somehow distinguish the process that wrote to the file to avoid an infinite loop. The files are local but in an Ubuntu VM that has a samba share so they are accessed via a drive letter in Windows (Chrome is told that path). The solution just has to work, I don't care what language or platform.

How do I change LaTeX to MathML using MathJax in Node.js?

I'm trying to render math equations from user input server side using MathJax in Node.js. I'm using a separate library (mathjs) to turn the input into LaTeX, but after spending an hour looking at the MathJax docs I'm no closer to turning the LaTeX into MathML.
I'm assuming I'd be using the mathjax package on NPM, and then use the MathJax.InputJax and MathJax.OutputJax classes to do the processing, but I've got no idea how to put everything together.
(In case anyone is wondering, I'm using a CSS file to polyfill MathML, rather than load MathJax in the browser and cause a delay while the processing happens.)
You want to use MathJax-node for this. It is set up to run MathJax server-side. There are a number of example command-line tools in the bin directory. You could also hook up a web service to handle the conversion. Tim Arnold made one available as mathjax-server on npmjs.com.

Does MathJax cache SVG content?

I have extracted LaTeX content from .tex file, that I put on the website and choose SVG as output, because it provides the smallest possible size so I consider that It will be the best choise also because of his speed and widest versatility. I know, that .js files that contains configurations are cached on the disk in the browser for a few days (depends on the config of the web) or CDN file, but there could be problem with availability of that page, but what about SVG content?
Does it also cache on the disc?
Thank you
Yes and no, depending on what you mean.
For the SVG output, MathJax encodes its "fonts" as path data in JS files, see the code. These paths are cached like any other resource.
But the actual output is generated on the fly from these paths, so the individual equations will not be cached (because making MathJax aware of them would be difficult).
They are stable enough to be reused though, i.e. via local storage and you can generate SVG server side using MathJax-node.

Octopress preview with local mathjax?

I often write posts with limited or no connectivity, which is one reason octopress is so appealing: it makes it really natural to write and preview posts offline. The problem is that I cannot figure out how to make MathJax play ball. I have it set up and working properly using the CDN, which is how the static pages get uploaded to the server. But what I want is to be able to use a local mathjax to preview the posts offline. This I do not know how to achieve.
To be sure, I can change the source/_includes/custom/head.html point it to ./mathjax/MathJax.js, but that only works if after rake generate I do cp /path/to/mathjax public/. But then I have to do this after every site (re-)generation, which is... cumbersome, to put it mildly. I've tried symbolic links, relative and absolute paths, but to no avail. Is there a better alternative?
Thank you in advance.
If all you need is the MathJax.js, you can put that in source/javascripts/. Doing so will add that file to the Octopress site which in turn means it'll be added to your site every time it's regenerated. source is the base of the Jekyll site Octopress has, so put everything in there except plugins and sass files.

How to automate generation of SVG file with Graphviz?

I decided to start a project which is essentially a website. This website will be published through Github Pages.
My website will include an SVG file. The SVG file is generated by Graphviz from a DOT-file. The idea is that to modify the information displayed in the SVG, users can change the definition of the DOT-file, then Graphviz will re-generate the SVG, and the new SVG image will automatically be displayed once the web page is served.
However, I am left in the uncomfortable situation of requiring contributors who edit the DOT-file to run a script that calls Graphviz, and then commit changes to both the SVG and the DOT file.
If a contributor changes the DOT-file, but forgets to run the Graphviz script, then commits, the repository will contain a DOT-file and an SVG which are inconsistent with each other.
I can't not track versions of the DOT-file, because the SVG is gibberish - the DOT-file is the human-editable definition. I can't not track the SVG, because, how else will it stay up to date and available to Github Pages for consumption? And yet, with both of them tracked, I am essentially keeping track of changes in a redundant manner, and introducing opportunity for conflicts. It's a bit like versioning both your C code and the compiled .exe. Which is silly.
What's the best way of making sure that whenever the DOT-file is edited, the SVG will stay concurrent with it? Do I need to seriously rethink my strategy?
You might consider setting up a Jenkins instance to do this. Create a job that is triggered by a change in the dot file (using the git plugin). The job would execute the dot command and then commit the new svg file.
Generated files should not by committed to your repository.
By default, GitHub Pages uses Jekyll to create sites.
If you are using this workflow, then I would suggest taking a look at writing/using a Jekyll Generator plugin to dynamically create this SVG from your DOT-file.

Resources