Algov/qrcode.chapril.org
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Allow empty automatic sizes + better HTML semantics and forms

Browse Source
This commit is contained in:
Miraty 2021-11-06 00:33:15 +01:00
parent 5de9221d22
commit 69d172a8d8
6 changed files with 108 additions and 98 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
inc.php
View File

@ -2,9 +2,9 @@
require "config.inc.php"; require "config.inc.php";
define("DEFAULT_REDONDANCY", "H"); define("DEFAULT_REDONDANCY", "high");
define("DEFAULT_MARGIN", 10); define("DEFAULT_MARGIN", NULL);
define("DEFAULT_SIZE", 100); define("DEFAULT_SIZE", NULL);
define("DEFAULT_BGCOLOR", "FFFFFF"); define("DEFAULT_BGCOLOR", "FFFFFF");
define("DEFAULT_MAINCOLOR", "000000"); define("DEFAULT_MAINCOLOR", "000000");

62
index.php
View File

@ -53,11 +53,15 @@ if (
if (is_numeric($_POST['margin']) AND $_POST['margin'] >= 0 AND $_POST['margin'] <= 1024) if (is_numeric($_POST['margin']) AND $_POST['margin'] >= 0 AND $_POST['margin'] <= 1024)
$params['margin'] = $_POST['margin']; $params['margin'] = $_POST['margin'];
else if (empty($_POST['margin']))
$params['margin'] = NULL;
else else
exit("Wrong value for margin"); exit("Wrong value for margin");
if (is_numeric($_POST['size']) AND $_POST['size'] >= 1 AND $_POST['size'] <= 1024) if (is_numeric($_POST['size']) AND $_POST['size'] >= 1 AND $_POST['size'] <= 4096)
$params['size'] = $_POST['size']; $params['size'] = $_POST['size'];
else if (empty($_POST['size']))
$params['size'] = NULL;
else else
exit("Wrong value for size"); exit("Wrong value for size");
@ -117,28 +121,24 @@ if (
<div id="firstWrapper"> <div id="firstWrapper">
<div class="param" id="txtParam"> <div class="param" id="txtParam">
<label for="txt">
<details> <details>
<summary><?= $loc['label_content'] ?></summary> <summary><label for="txt"><?= $loc['label_content'] ?></label></summary>
<p class="helpText"> <div class="helpText">
<?= $loc['help_content'] ?> <?= $loc['help_content'] ?>
</p> </div>
</details> </details>
</label> <textarea rows="8" required="" id="txt" placeholder="<?= $loc['placeholder'] ?>" name="txt"><?= htmlspecialchars($params['txt']) ?></textarea>
<textarea rows="8" required="" id="txt" placeholder="<?= $loc['placeholder'] ?>" name="txt" minlenght="5" maxlenght="50"><?= htmlspecialchars($params['txt']) ?></textarea>
</div> </div>
<div id="sideParams"> <div id="sideParams">
<div class="param"> <div class="param">
<label for="redondancy">
<details> <details>
<summary><?= $loc['label_redondancy'] ?></summary> <summary><label for="redondancy"><?= $loc['label_redondancy'] ?></label></summary>
<p class="helpText"> <p class="helpText">
<?= $loc['help_redondancy'] ?> <?= $loc['help_redondancy'] ?>
</p> </p>
</details> </details>
</label>
<select id="redondancy" name="redondancy"> <select id="redondancy" name="redondancy">
<option <?php if ($params['redondancy'] === "low") echo 'selected="" '; ?>value="low">L - 7%</option> <option <?php if ($params['redondancy'] === "low") echo 'selected="" '; ?>value="low">L - 7%</option>
<option <?php if ($params['redondancy'] === "medium") echo 'selected="" '; ?>value="medium">M - 15%</option> <option <?php if ($params['redondancy'] === "medium") echo 'selected="" '; ?>value="medium">M - 15%</option>
@ -148,27 +148,35 @@ if (
</div> </div>
<div class="param"> <div class="param">
<label for="margin">
<details> <details>
<summary><?= $loc['label_margin'] ?></summary> <summary><label for="margin"><?= $loc['label_margin'] ?></label></summary>
<p class="helpText"> <p class="helpText">
<?= $loc['help_margin'] ?> <?= $loc['help_margin'] ?>
</p> </p>
</details> </details>
</label> <input type="number" list="margins" id="margin" placeholder="<?= $loc['placeholder_pixels'] ?>" name="margin" min="0" max="1024" value="<?= htmlspecialchars($params['margin']) ?>">
<input type="number" id="margin" placeholder="2" name="margin" min="0" max="1024" value="<?= htmlspecialchars($params['margin']) ?>"> <datalist id="margins">
<option value="16">
<option value="32">
<option value="64">
<option value="128">
</datalist>
</div> </div>
<div class="param"> <div class="param">
<label for="size">
<details> <details>
<summary><?= $loc['label_size'] ?></summary> <summary><label for="size"><?= $loc['label_size'] ?></label></summary>
<p class="helpText"> <p class="helpText">
<?= $loc['help_size'] ?> <?= $loc['help_size'] ?>
</p> </p>
</details> </details>
</label> <input type="number" list="sizes" id="size" placeholder="<?= $loc['placeholder_pixels'] ?>" name="size" min="1" max="4096" value="<?= htmlspecialchars($params['size']) ?>">
<input type="number" id="size" placeholder="4" name="size" min="1" max="1024" value="<?= htmlspecialchars($params['size']) ?>"> <datalist id="sizes">
<option value="128">
<option value="256">
<option value="512">
<option value="1024">
</datalist>
</div> </div>
</div> </div>
@ -198,19 +206,17 @@ if (
</form> </form>
<section id="output">
<?php <?php
if (!empty($params['txt'])) { if (!empty($params['txt'])) {
require "barcode-generator/Utils/QrCode.php"; require "barcode-generator/Utils/QrCode.php";
$qrCode = new QrCode(); $qrCode = new QrCode();
if (!is_null($params['margin']))
$qrCode->setPadding($params['margin']);
$qrCode $qrCode
->setText($params['txt']) ->setText($params['txt'])
->setSize($params['size']) ->setSize($params['size'])
->setPadding($params['margin'])
->setErrorCorrection($params['redondancy']) ->setErrorCorrection($params['redondancy'])
->setForegroundColor(array( ->setForegroundColor(array(
'r' => hexdec(substr($params['mainColor'],0,2)), 'r' => hexdec(substr($params['mainColor'],0,2)),
@ -223,21 +229,23 @@ if (
'b' => hexdec(substr($params['bgColor'],4,2)), 'b' => hexdec(substr($params['bgColor'],4,2)),
)) ))
->setImageType(QrCode::IMAGE_TYPE_PNG); ->setImageType(QrCode::IMAGE_TYPE_PNG);
$base64 = $qrCode->generate(); $dataUri = $qrCode->getDataUri();
$qrSize = $qrCode->getSize() + 2 * $qrCode->getPadding();
?> ?>
<section id="output">
<div class="centered" id="downloadQR"> <div class="centered" id="downloadQR">
<a href="data:image/png;base64,<?= $base64 ?>" class="button" download="<?= htmlspecialchars($params['txt']); ?>.png"><?= $loc['button_download'] ?></a> <a href="<?= $dataUri ?>" class="button" download="<?= htmlspecialchars($params['txt']); ?>.png"><?= $loc['button_download'] ?></a>
</div> </div>
<div class="centered" id="showOnlyQR"> <div class="centered" id="showOnlyQR">
<a title="<?= $loc['title_showOnlyQR'] ?>" href="data:image/png;base64,<?= $base64 ?>"><img alt='<?= $loc['alt_QR_before'] ?><?= htmlspecialchars($params['txt']); ?><?= $loc['alt_QR_after'] ?>' id="qrCode" src="data:image/png;base64,<?= $base64 ?>"></a> <a title="<?= $loc['title_showOnlyQR'] ?>" href="<?= $dataUri ?>"><img width="<?= $qrSize ?>" height="<?= $qrSize ?>" alt='<?= $loc['alt_QR_before'] ?><?= htmlspecialchars($params['txt']); ?><?= $loc['alt_QR_after'] ?>' id="qrCode" src="<?= $dataUri ?>"></a>
</div> </div>
</section>
<?php } ?> <?php } ?>
</section>
<footer> <footer>
<section id="info" class="metaText"> <section id="info" class="metaText">

18
locales/en.php
View File

@ -11,16 +11,14 @@ $loc = array(
'label_mainColor' => "Foreground color", 'label_mainColor' => "Foreground color",
'placeholder' => "Enter the text to encode in the QR code", 'placeholder' => "Enter the text to encode in the QR code",
'placeholder_pixels' => "automatic",
'help_content' => " 'help_content' => "
You can only encode whatever text you want.<br> <p>You can encode whatever text you want.</p>
Software which decodes these QR codes could suggest to open them with dedicated software, depending on their <a href='https://en.wikipedia.org/wiki/List_of_URI_schemes'>URI scheme</a>.<br><br> <p>Software which decodes these QR codes could suggest to open them with dedicated software, depending on their <a href='https://en.wikipedia.org/wiki/List_of_URI_schemes' hreflang='en' rel='help external noreferrer'>URI scheme</a>.</p>
For instance, to open a webpage:<br> <p>For instance, to open a webpage: <code>https://www.example/</code></p>
https://www.example/<br><br> <p>To send an email: <code>mailto:contact@email.example</code></p>
To send an email:<br> <p>To share geographic coordinates: <code>geo:48.867564,2.364057</code></p>
mailto:contact@email.example<br><br>
To share geographic coordinates:<br>
geo:48.867564,2.364057
", ",
'help_redondancy' => "Redundancy is the duplication of information in the QR code to correct errors during decoding. A higher rate will produce a bigger QR code, but will have a better chance of being decoded correctly.", 'help_redondancy' => "Redundancy is the duplication of information in the QR code to correct errors during decoding. A higher rate will produce a bigger QR code, but will have a better chance of being decoded correctly.",
'help_margin' => "Number of pixels in the white bands around the QR code.", 'help_margin' => "Number of pixels in the white bands around the QR code.",
@ -37,9 +35,9 @@ $loc = array(
'metaText_qr' => " 'metaText_qr' => "
<h3>What's a QR code?</h3> <h3>What's a QR code?</h3>
A QR code is a 2 dimensional barcode in which text is written in binary. It can be decoded with a device equipped with a photo sensor and an adequate software. A QR code is a 2 dimensional barcode in which text is written in binary. It can be decoded with a device equipped with a photo sensor and an adequate software.
<a href='https://en.wikipedia.org/wiki/QR_code'>QR code on Wikipedia</a>. <a href='https://en.wikipedia.org/wiki/QR_code' hreflang='en' rel='help external noreferrer'>QR code on Wikipedia</a>.
", ",
'metaText_legal' => "LibreQR " . $libreqrVersion . " is a free software whose <a href='https://code.antopie.org/miraty/libreqr/'>source code</a> is available under the terms of the <abbr title='GNU Affero General Public License version 3 or any later version'><a href='LICENSE.html'>AGPLv3</a>+</abbr>.", 'metaText_legal' => "LibreQR " . $libreqrVersion . " is a free software whose <a href='https://code.antopie.org/miraty/libreqr/' rel='external noreferrer'>source code</a> is available under the terms of the <abbr title='GNU Affero General Public License version 3 or any later version'><a href='LICENSE.html' hreflang='en' rel='license'>AGPLv3</a>+</abbr>.",
'opensearch_description' => "Generate QR codes from your search or address bar", 'opensearch_description' => "Generate QR codes from your search or address bar",
); );

18
locales/fr.php
View File

@ -11,16 +11,14 @@ $loc = array(
'label_mainColor' => "Couleur de premier plan", 'label_mainColor' => "Couleur de premier plan",
'placeholder' => "Entrez le texte à encoder dans le code QR", 'placeholder' => "Entrez le texte à encoder dans le code QR",
'placeholder_pixels' => "automatique",
'help_content' => " 'help_content' => "
Vous pouvez encoder ce que vous voulez sous forme de texte.<br> <p>Vous pouvez encoder ce que vous voulez sous forme de texte.</p>
Les logiciels qui décodent ces codes QR pourraient proposer de les ouvrir avec un logiciel dédié, en fonction de leur <a href='https://fr.wikipedia.org/wiki/Sch%C3%A9ma_d%27URI'>schéma d'URI</a>.<br><br> <p>Les logiciels qui décodent ces codes QR pourraient proposer de les ouvrir avec un logiciel dédié, en fonction de leur <a href='https://fr.wikipedia.org/wiki/Sch%C3%A9ma_d%27URI' hreflang='fr' rel='help external noreferrer'>schéma d'URI</a>.</p>
Par exemple, pour ouvrir une page Web :<br> <p>Par exemple, pour ouvrir une page Web : <code>https://www.example/</code></p>
https://www.example/<br><br> <p>Pour envoyer un mail : <code>mailto:contact@email.example</code></p>
Pour envoyer un mail :<br> <p>Pour partager des coordonnées géographique : <code>geo:48.867564,2.364057</code></p>
mailto:contact@email.example<br><br>
Pour partager des coordonnées géographique :<br>
geo:48.867564,2.364057
", ",
'help_redondancy' => "La redondance est la duplication des informations dans le code QR afin de corriger les erreurs lors du décodage. Un taux plus élevé produira un code QR plus grand, mais aura plus de chance d'être décodé correctement.", 'help_redondancy' => "La redondance est la duplication des informations dans le code QR afin de corriger les erreurs lors du décodage. Un taux plus élevé produira un code QR plus grand, mais aura plus de chance d'être décodé correctement.",
'help_margin' => "Nombre de pixels des bandes blanches autour du code QR.", 'help_margin' => "Nombre de pixels des bandes blanches autour du code QR.",
@ -37,9 +35,9 @@ $loc = array(
'metaText_qr' => " 'metaText_qr' => "
<h3>Qu'est-ce qu'un code QR ?</h3> <h3>Qu'est-ce qu'un code QR ?</h3>
Un code QR est un code-barres en 2 dimensions dans lequel du texte est inscrit en binaire. Il peut être décodé avec un appareil muni d'un capteur photo et d'un logiciel adéquat. Un code QR est un code-barres en 2 dimensions dans lequel du texte est inscrit en binaire. Il peut être décodé avec un appareil muni d'un capteur photo et d'un logiciel adéquat.
<a href='https://fr.wikipedia.org/wiki/Code_QR'>Code QR sur Wikipédia</a>. <a href='https://fr.wikipedia.org/wiki/Code_QR' hreflang='fr' rel='help external noreferrer'>Code QR sur Wikipédia</a>.
", ",
'metaText_legal' => "LibreQR " . $libreqrVersion . " est un logiciel libre dont le <a href='https://code.antopie.org/miraty/libreqr/'>code source</a> est disponible selon les termes de l'<abbr title='GNU Affero General Public License version 3 ou toute version ultérieure'><a href='LICENSE.html'>AGPLv3</a>+</abbr>.", 'metaText_legal' => "LibreQR " . $libreqrVersion . " est un logiciel libre dont le <a href='https://code.antopie.org/miraty/libreqr/' rel='external noreferrer'>code source</a> est disponible selon les termes de l'<abbr title='GNU Affero General Public License version 3 ou toute version ultérieure'><a href='LICENSE.html' hreflang='en' rel='license'>AGPLv3</a>+</abbr>.",
'opensearch_description' => "Générez des codes QR depuis votre barre de recherche ou d'adresse", 'opensearch_description' => "Générez des codes QR depuis votre barre de recherche ou d'adresse",
); );

18
locales/oc.php
View File

@ -11,16 +11,14 @@ $loc = array(
'label_mainColor' => "Color del primièr plan", 'label_mainColor' => "Color del primièr plan",
'placeholder' => "Dintratz lo tèxt de codar en còdi QR", 'placeholder' => "Dintratz lo tèxt de codar en còdi QR",
'placeholder_pixels' => "auto",
'help_content' => " 'help_content' => "
Podètz pas que codar lo tèxt que volètz.<br> <p>Podètz pas que codar lo tèxt que volètz.</p>
Los logicials que deschifran los còdis QR poirián suggerir de los dubrir dins de logicials especials, segon lor <a href='https://en.wikipedia.org/wiki/List_of_URI_schemes'>esquèma URI</a>.<br><br> <p>Los logicials que deschifran los còdis QR poirián suggerir de los dubrir dins de logicials especials, segon lor <a href='https://en.wikipedia.org/wiki/List_of_URI_schemes' hreflang='en' rel='help external noreferrer'>esquèma URI</a>.</p>
Per exemple, per dubrir la pagina web :<br> <p>Per exemple, per dubrir la pagina web : https://www.example/</p>
https://www.example/<br><br> <p>Per enviar un corrièl : mailto:contact@email.example</p>
Per enviar un corrièl :<br> <p>Per partejar de coordonadas geograficas : geo:48.867564,2.364057</p>
mailto:contact@email.example<br><br>
Per partejar de coordonadas geograficas :<br>
geo:48.867564,2.364057
", ",
'help_redondancy' => "La redondància es la duplicacion de las informacions al còdi QR per dire de corregir las errors pendent lo deschiframent. Un taux mai naut produirà un còdi mai grand, mas serà de melhor deschifrar corrèctament.", 'help_redondancy' => "La redondància es la duplicacion de las informacions al còdi QR per dire de corregir las errors pendent lo deschiframent. Un taux mai naut produirà un còdi mai grand, mas serà de melhor deschifrar corrèctament.",
'help_margin' => "Nombre de pixèls de la banda blanca a l’entorn del còdi QR.", 'help_margin' => "Nombre de pixèls de la banda blanca a l’entorn del còdi QR.",
@ -37,9 +35,9 @@ $loc = array(
'metaText_qr' => " 'metaText_qr' => "
<h3>Qu’es aquò un còdi QR ?</h3> <h3>Qu’es aquò un còdi QR ?</h3>
Un còdi QR es un còdi de barras en doas dimensions dins lo qual lo tèxt es escrich en binari. Un aparalh equipat d’un capteur optic pòt lo deschifrar, amb l’aplicacion que cal. Un còdi QR es un còdi de barras en doas dimensions dins lo qual lo tèxt es escrich en binari. Un aparalh equipat d’un capteur optic pòt lo deschifrar, amb l’aplicacion que cal.
<a lang='ca' href='https://ca.wikipedia.org/wiki/Codi_QR'>Còdi QR a la Wikipèdia</a>. <a lang='ca' href='https://ca.wikipedia.org/wiki/Codi_QR' hreflang='ca' rel='help external noreferrer'>Còdi QR a la Wikipèdia</a>.
", ",
'metaText_legal' => "LibreQR " . $libreqrVersion . " es un logicial liure que son <a href='https://code.antopie.org/miraty/libreqr/'>còdi font</a> es disponible jols tèrmes de la licéncia <abbr title='GNU Affero General Public License version 3 or any later version'><a href='LICENSE.html'>AGPLv3</a>+</abbr>.", 'metaText_legal' => "LibreQR " . $libreqrVersion . " es un logicial liure que son <a href='https://code.antopie.org/miraty/libreqr/' rel='external noreferrer'>còdi font</a> es disponible jols tèrmes de la licéncia <abbr title='GNU Affero General Public License version 3 or any later version'><a href='LICENSE.html' hreflang='en' rel='license'>AGPLv3</a>+</abbr>.",
'opensearch_description' => "Generatz de còdis QR a partir de la barra de recèrca o d’adreça", 'opensearch_description' => "Generatz de còdis QR a partir de la barra de recèrca o d’adreça",
); );

8
style.less
View File

@ -77,6 +77,14 @@ a {
@media @dark { @media @dark {
background-color: @bgHelp-dark; background-color: @bgHelp-dark;
} }
& p {
margin-top: 0px;
margin-bottom: 8px;
&:last-child {
margin-bottom: 0px;
}
}
} }
#sideParams { #sideParams {