RFE: special-page for making printable pages with QRCodes dynamically

[ankostis]

Design

Use case

We need to print QRCodes with the URL of our articles on a clean sheet of paper (without the content of that articles) We want to have a pre-configured "to-be-printed" page containing a QRCode placeholder. Then each article would provide a "link" to that page, but with its page-url as a parameter, which would set the actual QRCode generated.

Good-to-have: open those links directly in browser's print dialog.

Problem

The extension's parser-function generates "static" QRCodes, in the sense, that its arguments are stored in some page. As it is now, in order change the qrcode, the above to-be-printed page must be edited, saved and then printed. This is not user-friendly, and requires edit-permissions.

Alternatives i have thought of are

1. to always create one extra page for each article with just its QRCode, or
2. to dynamically apply @media css to hide all but the QRCode of the page.

(1) is a waste of effort/resources and a bit complex to setup, (2) feels clumsy.

Preferred solution

It would be nice to have a special page which allow to generate QRs based on parameters of its url, eg:

https://server.com/wiki/Special:QRLite/SomeTemplate/firstparam/otherparam=bar

Or

https://server.com/wiki/Special:QRLite?template=fooTemplate&firstparam&otherparam=bar

Workaround

I managed to workarounp this and created a "dynamic' page for generating QRs by using Extension:UrlGetParameters. I'm sharing the code here to explain what i have in mind, and also for future reference.

PrintQRLite: the "special"-like page to be printed embedding just a QR-code

Note: the template name {{Template:QRLitePrintContent}} in my page below is "pinned", but it could also come from the url.

<!-- 
  DEBUG: set a default value to the 2 {{#urlget:qrcode4page|DEFAULT}} below.
-->{{#if: 
 {{#urlget:qrcode-text}}
 |{{QRLitePrintContent|{{#urldecode: {{#urlget:qrcode-text}} }}
    |format={{#urlget:qrcode-format|}} 
    |ecc={{#urlget:qrcode-ecc|}} 
    |size={{#urlget:qrcode-size|}} 
    |margin={{#urlget:qrcode-margin|}} 
  }}
 |
== No page specified for QRCode! ==
This is a "special"-like page that will print the QRCode of the text given in the <code>qrcode-text</code> url-param
(the page-to-be-printed is based on the [[Template:QRLitePrintContent]]).  

Invoke it like:
 {{localurl:{{FULLPAGENAME}}|action=render&qrcode-text={{urlencode:Hello Wiki}}}}

Attention: Remember to escape text when building the URL query-part, like: 

  <nowiki>...&qrcode-text={{urlencode:"strange" text!}}</nowiki>

=== URL parameters ===
; qrcode-text
: what to print as QRCode

; qrcode-(format, ecc, size, margin)
: Correspond to the parameters of the [https://www.mediawiki.org/wiki/Extension:QRLite Extension:QRLite].
}}

[[Category:QRCode machinery]]

The page above dependes on this following template defining the content to print.

Template:QRLitePrintContent: my QRCode content of the special-page above.

<noinclude>
The content for the special-like- page in [[PrintQRLite]] which prints arbitrary QRCodes.

Syntax:
  <nowiki>{{</nowiki>{{PAGENAME}}|<qrcode-text eg. URL>|format=svg|ecc=2|size=|margin=}}

For params, see https://www.mediawiki.org/wiki/Extension:QRLite

[[Category:QRCode machinery]]
</noinclude><includeonly><div style="text-align: center;">
{{#qrlite: {{{1}}}
 |format={{#if:{{{format|}}}|{{{format}}}|svg}}
 |ecc={{#if:{{{ecc|}}}|{{{ecc}}}|2}}
 |{{#if:{{{size|}}}|size={{{size}}}}}
 |{{#if:{{{margin|}}}|margin={{{margin}}}}}
}}

<span style="font-size: large; font-weight: bold;">{{{1}}}</span><span style="font-size: small;">({{CURRENTTIMESTAMP}})</span>
</div>
{{DISPLAYTITLE:QRCode for {{{1}}}}}
</includeonly>

Template:DataPageQRCode: my template for presenting a QRCode along with a "print..." link leading to the special-page

<noinclude>
Adds a floating QRCode to the right for the page using it.
The floating panel has printable links using [[PrintQRLite]] "special" page.

Syntax:
 <nowiki>{{</nowiki>{{PAGENAME}}|format=svg|ecc=2|size=|margin=0}}

[[Category:Data LEGOs]][[Category:QRCode machinery]]
</noinclude><includeonly>{{#vardefine:qrtext|{{canonicalurl:{{FULLPAGENAME}}}}}}
<div class="data-page-qrcode">
{{#qrlite:{{#var:qrtext}}|format={{{format|svg}}}|ecc={{{ecc|2}}}|size={{{size|6}}}|margin={{{margin|0}}}}}

<span class="print-qrcode-links">[{{fullurl:PrintQRLite
  |action=render&qrcode-text={{urlencode:{{#var:qrtext}}}}&qrcode-size=6
}} Print...]</span>
</div>

MediaWiki:Common.js: add this to make the "print..." links above open in browser's "print" dialog

// Open [[PrintQRLit]] with [[QRLitePrintContent]] in window.print().
// From https://stackoverflow.com/a/45923929/548792
$(function () {
    $('.data-page-qrcode .print-qrcode-links a').each(function() {
        $(this).click(function() {
            open(this.href).print(); 
            return false;
        });
    });
});

// [[Category:QRCode_machinery]]

[ankostis]

Informing that i managed to abuse the CiteThisPage extension and implemented the idea laid out above for printing QRCodes for arbitrary pages.

[samwilson]

I'm looking at how to add QR Codes for task T329973 Add feature to create a QR code for and on a Wikimedia page and am wondering if a special page like described above would be a good part of the solution. We're looking at adding it to UrlShortener, but that's previously been declined, so maybe QRLite would be a good place to do it.