Automatic screenshots of "interactive"

[Rob Beezer]

Authors and Instructional Designers,

I have automatic screenshotting of interactive applications working,
so you can populate the print representations in an automated way.
Here is a sketch, see the sample article to reverse-engineer.

If you already have an interactive/@preview then no automatic
screenshot will be attempted for that interactive (since you have
a hand-crafted one already).

Thanks for your patience waiting for this one - it was not easy.

Rob


* Install node.js/npm if you do not have it already.

* "pageres" is the main tool here:
https://github.com/sindresorhus/pageres-cli

Install (as root?) with: npm install --global pageres-cli

I could not get a global install to succeed, so have a user-level
install to use. PhantomJS is a headless web browser, I ended up
getting it via the Ubuntu package manager in the course of sorting
out global v. user.

Then I needed to add the full path on the executable in the
mbx.cfg configuration file.

* You will be happier in the long run if all your "interactive"
have author-specified @xml:id, since these can change and will
also be used to name the screenshots.

* Edit/add docinfo/html/baseurl/@href to be the URL of the directory
your HTML files live in on the server. No trailing slash.

* Rebuild HTML and upload to the server.

* Use something like

/path/to/script/mbx -vv -c preview -f png -d . /path/to/my-book.xml

** I think the -f is ignored.

** pageres writes into the current directory. Should be handled,
but you might want to set the default directory someplace in /tmp

** there is a 5-second delay to let each interactive load,
not yet configurable

* Copy *.png produced to your "images" directory (locally, not on server)

* Build LaTeX to see new images in place.

[Karl-Dieter Crisman]

Thanks, Rob, I look forward to trying this out very much, and I'm sure I am not the only one!  This was one of the few remaining "automation" pieces obstructing PTX from full viability, I think.

A couple comments on process for this:

1) https://github.com/ariya/phantomjs/issues/15344 indicates that phantomjs is (intentionally) no longer under active development.  One comment I read indicated both Chrome and FF now have headless modes.  So just wondering about the long-term viability of this particular solution (especially given the troubles I've had getting pageres-cli to install this morning), not that pageres-cli seems to allow even opening issues (how do they pull that off, give money to GH?).

2) I can't find the specifications for docinfo/html in the schema.  In fact, there seem to be two different ones - favicon and baseurl, which are split up in the sample article code.

Great news!

Karl-Dieter

[Karl-Dieter Crisman]

*  "pageres" is the main tool here:
    https://github.com/sindresorhus/pageres-cli

    Install (as root?) with:  npm install --global pageres-cli

    I could not get a global install to succeed, so have a user-level
    install to use.  PhantomJS is a headless web browser, I ended up
    getting it via the Ubuntu package manager in the course of sorting
    out global v. user.

Note for Mac users: probably the most painless way to get this is 

0) Install npm but don't destroy your entire node configuration like I did

1) Download binary phantomjs from http://phantomjs.org/download.html

2) Link to /usr/local/bin from wherever you put phantomjs (probably need sudo for this) e.g. https://stackoverflow.com/questions/33540903/install-phantomjs-on-macos-10-11-el-captian

3) sudo npm install pageres-cli (no global, that is).  You might get a message like this, but I am not worrying about it: found 3 vulnerabilities (2 low, 1 critical)

> Then I needed to add the full path on the executable in the mbx.cfg configuration file.

Interestingly, I have

$ find /usr/local -name "pageres"

/usr/local/bin/pageres

but it turns out it is only a link to a nonexistent ../lib/node_modules/pageres-cli/cli.js so presumably it's a leftover from the aborted global install.  It took a while to find, but eventually it turned out that they are just in a node_modules directory right where I ran npm!  So YES you'll have to add this local path, and potential users should be aware of the very nontrivial pitfalls involved with using npm.

> *  Rebuild HTML and upload to the server. 

Why is this step necessary?  Could pageres just get it from a local install by (for instance) specifying a base url of your output directory for html locally?  Or would that run into the problems of serving up content that Safari/Chrome ban?  For some people it might be tough to do that step very often.

[Rob Beezer]

On 1/8/19 5:45 AM, Karl-Dieter Crisman wrote:
> 1) https://github.com/ariya/phantomjs/issues/15344 indicates that phantomjs is
> (intentionally) no longer under active development.  One comment I read
> indicated both Chrome and FF now have headless modes.  So just wondering about
> the long-term viability of this particular solution (especially given the
> troubles I've had getting pageres-cli to install this morning), not that
> pageres-cli seems to allow even opening issues (how do they pull that off, give
> money to GH?).

PhantomJS is a dependency we can't control, I believe. Just part of pageres.
Very little of the work in putting this together is the call to pageres, so it
can be swapped out with little fanfare. Alex J suggested this, I don't think
there were many alternatives. Keep a lookout.

> 2) I can't find the specifications for docinfo/html in the schema.  In fact,
> there seem to be two different ones - favicon and baseurl, which are split up in
> the sample article code.

"docinfo" need a reorg, and *then* it can go into the schema. It'll be the last
thing before the schema gets versioned. ;-) But there should not be two
docinfo/html! I'll fix that. Thanks.

Rob

[Rob Beezer]

My experience with Ubuntu, node.js, npm, pageres-cli was isomorphic.

I wish there was a better way. Thanks for the Mac notes.

On 1/8/19 7:25 AM, Karl-Dieter Crisman wrote:
>
> *  "pageres" is the main tool here:
> https://github.com/sindresorhus/pageres-cli
> <https://github.com/sindresorhus/pageres-cli>
>
>     Install (as root?) with:  npm install --global pageres-cli
>
>     I could not get a global install to succeed, so have a user-level
>     install to use.  PhantomJS is a headless web browser, I ended up
>     getting it via the Ubuntu package manager in the course of sorting
>     out global v. user.
>
>
> Note for Mac users: probably the most painless way to get this is
>
> 0) Install npm but don't destroy your entire node configuration like I did
> 1) Download binary phantomjs from http://phantomjs.org/download.html
> 2) Link to /usr/local/bin from wherever you put phantomjs (probably need sudo
> for this)
> e.g. https://stackoverflow.com/questions/33540903/install-phantomjs-on-macos-10-11-el-captian
> 3) sudo npm install pageres-cli (no global, that is).  You might get a message

> like this, but I am not worrying about it: found 3vulnerabilities (2 *low*, 1

> critical)
>
>> Then I needed to add the full path on the executable in the mbx.cfg
> configuration file.
>
> Interestingly, I have
>
> $ find /usr/local -name "pageres"
> /usr/local/bin/pageres
>
> but it turns out it is only a link to a nonexistent
> ../lib/node_modules/pageres-cli/cli.js so presumably it's a leftover from the
> aborted global install.  It took a while to find, but eventually it turned out
> that they are just in a node_modules directory right where I ran npm!  So YES
> you'll have to add this local path, and potential users should be aware of the
> very nontrivial pitfalls involved with using npm.
>
> > *  Rebuild HTML and upload to the server.
>
> Why is this step necessary?  Could pageres just get it from a local install by
> (for instance) specifying a base url of your output directory for html locally?
>  Or would that run into the problems of serving up content that Safari/Chrome
> ban?  For some people it might be tough to do that step very often.
>

> --
> You received this message because you are subscribed to the Google Groups
> "PreTeXt development" group.
> To unsubscribe from this group and stop receiving emails from it, send an email
> to pretext-dev...@googlegroups.com
> <mailto:pretext-dev...@googlegroups.com>.
> To post to this group, send email to prete...@googlegroups.com
> <mailto:prete...@googlegroups.com>.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/pretext-dev/44e023b0-e5a7-4493-a6e0-4565195bc0b3%40googlegroups.com
> <https://groups.google.com/d/msgid/pretext-dev/44e023b0-e5a7-4493-a6e0-4565195bc0b3%40googlegroups.com?utm_medium=email&utm_source=footer>.
> For more options, visit https://groups.google.com/d/optout.

[Rob Beezer]

On 1/8/19 11:59 AM, Rob Beezer wrote:
>> 2) I can't find the specifications for docinfo/html in the schema.  In fact,
>> there seem to be two different ones - favicon and baseurl, which are split up
>> in the sample article code.
>
> "docinfo" need a reorg, and *then* it can go into the schema.  It'll be the last
> thing before the schema gets versioned.  ;-)  But there should not be two
> docinfo/html!  I'll fix that.  Thanks.

Fixed.

[Karl-Dieter Crisman]

Followup: Are these instructions in documentation now?  If not, I can open a ticket for that - hopefully within a month I can finally start trying it for real and testing its robustness :-) 

[yourphys...@gmail.com]

I'll work any Windows-specific instructions today or tomorrow. 

Rick

[yourphys...@gmail.com]

I followed the above instructions. I was able to load pageres with the npm --global option without a problem.

I copied mbx.cfg to a new /user directory and put the full path to pageres (for Windows users, use the following command at the root directory:   C:\where pageres

I rebuilt the html and then ran mbx. I got the following error:

Traceback (most recent call last):

  File "/users/rickr/pretext-fork/script/mbx", line 1503, in <module>

    preview_images(args.xml_file, args.xmlid, output_dir)

  File "/users/rickr/pretext-fork/script/mbx", line 839, in preview_images

    extraction_xslt = '/'.join(mbx_xsl_dir, 'extract-interactive.xsl')

TypeError: join() takes exactly one argument (2 given)

[Karl-Dieter Crisman]

Followup: Are these instructions in documentation now?  If not, I can open a ticket for that - hopefully within a month I can finally start trying it for real and testing its robustness :-) 

Apparently these instructions are NOT in documentation.  At least I searched GH for "pageres" and only found code.  See  https://github.com/rbeezer/mathbook/issues/1077