Allow empty automatic sizes + better HTML semantics and forms
This commit is contained in:
Miraty
parent
5de9221d22
commit
69d172a8d8
6 changed files with 108 additions and 98 deletions
6
inc.php
6
inc.php
|
|
@ -2,9 +2,9 @@
|
|||
|
||||
require "config.inc.php";
|
||||
|
||||
define("DEFAULT_REDONDANCY", "H");
|
||||
define("DEFAULT_MARGIN", 10);
|
||||
define("DEFAULT_SIZE", 100);
|
||||
define("DEFAULT_REDONDANCY", "high");
|
||||
define("DEFAULT_MARGIN", NULL);
|
||||
define("DEFAULT_SIZE", NULL);
|
||||
define("DEFAULT_BGCOLOR", "FFFFFF");
|
||||
define("DEFAULT_MAINCOLOR", "000000");
|
||||
|
||||
|
|
|
|||
62
index.php
62
index.php
|
|
@ -53,11 +53,15 @@ if (
|
|||
|
||||
if (is_numeric($_POST['margin']) AND $_POST['margin'] >= 0 AND $_POST['margin'] <= 1024)
|
||||
$params['margin'] = $_POST['margin'];
|
||||
else if (empty($_POST['margin']))
|
||||
$params['margin'] = NULL;
|
||||
else
|
||||
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'];
|
||||
else if (empty($_POST['size']))
|
||||
$params['size'] = NULL;
|
||||
else
|
||||
exit("Wrong value for size");
|
||||
|
||||
|
|
@ -117,28 +121,24 @@ if (
|
|||
<div id="firstWrapper">
|
||||
|
||||
<div class="param" id="txtParam">
|
||||
<label for="txt">
|
||||
<details>
|
||||
<summary><?= $loc['label_content'] ?></summary>
|
||||
<p class="helpText">
|
||||
<summary><label for="txt"><?= $loc['label_content'] ?></label></summary>
|
||||
<div class="helpText">
|
||||
<?= $loc['help_content'] ?>
|
||||
</p>
|
||||
</div>
|
||||
</details>
|
||||
</label>
|
||||
<textarea rows="8" required="" id="txt" placeholder="<?= $loc['placeholder'] ?>" name="txt" minlenght="5" maxlenght="50"><?= htmlspecialchars($params['txt']) ?></textarea>
|
||||
<textarea rows="8" required="" id="txt" placeholder="<?= $loc['placeholder'] ?>" name="txt"><?= htmlspecialchars($params['txt']) ?></textarea>
|
||||
</div>
|
||||
|
||||
<div id="sideParams">
|
||||
|
||||
<div class="param">
|
||||
<label for="redondancy">
|
||||
<details>
|
||||
<summary><?= $loc['label_redondancy'] ?></summary>
|
||||
<summary><label for="redondancy"><?= $loc['label_redondancy'] ?></label></summary>
|
||||
<p class="helpText">
|
||||
<?= $loc['help_redondancy'] ?>
|
||||
</p>
|
||||
</details>
|
||||
</label>
|
||||
<select id="redondancy" name="redondancy">
|
||||
<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>
|
||||
|
|
@ -148,27 +148,35 @@ if (
|
|||
</div>
|
||||
|
||||
<div class="param">
|
||||
<label for="margin">
|
||||
<details>
|
||||
<summary><?= $loc['label_margin'] ?></summary>
|
||||
<summary><label for="margin"><?= $loc['label_margin'] ?></label></summary>
|
||||
<p class="helpText">
|
||||
<?= $loc['help_margin'] ?>
|
||||
</p>
|
||||
</details>
|
||||
</label>
|
||||
<input type="number" id="margin" placeholder="2" name="margin" min="0" max="1024" value="<?= htmlspecialchars($params['margin']) ?>">
|
||||
<input type="number" list="margins" id="margin" placeholder="<?= $loc['placeholder_pixels'] ?>" 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 class="param">
|
||||
<label for="size">
|
||||
<details>
|
||||
<summary><?= $loc['label_size'] ?></summary>
|
||||
<summary><label for="size"><?= $loc['label_size'] ?></label></summary>
|
||||
<p class="helpText">
|
||||
<?= $loc['help_size'] ?>
|
||||
</p>
|
||||
</details>
|
||||
</label>
|
||||
<input type="number" id="size" placeholder="4" name="size" min="1" max="1024" value="<?= htmlspecialchars($params['size']) ?>">
|
||||
<input type="number" list="sizes" id="size" placeholder="<?= $loc['placeholder_pixels'] ?>" name="size" min="1" max="4096" value="<?= htmlspecialchars($params['size']) ?>">
|
||||
<datalist id="sizes">
|
||||
<option value="128">
|
||||
<option value="256">
|
||||
<option value="512">
|
||||
<option value="1024">
|
||||
</datalist>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -198,19 +206,17 @@ if (
|
|||
|
||||
</form>
|
||||
|
||||
<section id="output">
|
||||
|
||||
<?php
|
||||
|
||||
if (!empty($params['txt'])) {
|
||||
|
||||
require "barcode-generator/Utils/QrCode.php";
|
||||
|
||||
$qrCode = new QrCode();
|
||||
if (!is_null($params['margin']))
|
||||
$qrCode->setPadding($params['margin']);
|
||||
$qrCode
|
||||
->setText($params['txt'])
|
||||
->setSize($params['size'])
|
||||
->setPadding($params['margin'])
|
||||
->setErrorCorrection($params['redondancy'])
|
||||
->setForegroundColor(array(
|
||||
'r' => hexdec(substr($params['mainColor'],0,2)),
|
||||
|
|
@ -223,21 +229,23 @@ if (
|
|||
'b' => hexdec(substr($params['bgColor'],4,2)),
|
||||
))
|
||||
->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">
|
||||
<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 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>
|
||||
</section>
|
||||
|
||||
<?php } ?>
|
||||
|
||||
</section>
|
||||
|
||||
<footer>
|
||||
|
||||
<section id="info" class="metaText">
|
||||
|
|
|
|||
|
|
@ -11,16 +11,14 @@ $loc = array(
|
|||
'label_mainColor' => "Foreground color",
|
||||
|
||||
'placeholder' => "Enter the text to encode in the QR code",
|
||||
'placeholder_pixels' => "automatic",
|
||||
|
||||
'help_content' => "
|
||||
You can only encode whatever text you want.<br>
|
||||
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>
|
||||
For instance, to open a webpage:<br>
|
||||
https://www.example/<br><br>
|
||||
To send an email:<br>
|
||||
mailto:contact@email.example<br><br>
|
||||
To share geographic coordinates:<br>
|
||||
geo:48.867564,2.364057
|
||||
<p>You can encode whatever text you want.</p>
|
||||
<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>
|
||||
<p>For instance, to open a webpage: <code>https://www.example/</code></p>
|
||||
<p>To send an email: <code>mailto:contact@email.example</code></p>
|
||||
<p>To share geographic coordinates: <code>geo:48.867564,2.364057</code></p>
|
||||
",
|
||||
'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.",
|
||||
|
|
@ -37,9 +35,9 @@ $loc = array(
|
|||
'metaText_qr' => "
|
||||
<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 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",
|
||||
);
|
||||
|
|
|
|||
|
|
@ -11,16 +11,14 @@ $loc = array(
|
|||
'label_mainColor' => "Couleur de premier plan",
|
||||
|
||||
'placeholder' => "Entrez le texte à encoder dans le code QR",
|
||||
'placeholder_pixels' => "automatique",
|
||||
|
||||
'help_content' => "
|
||||
Vous pouvez encoder ce que vous voulez sous forme de texte.<br>
|
||||
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>
|
||||
Par exemple, pour ouvrir une page Web :<br>
|
||||
https://www.example/<br><br>
|
||||
Pour envoyer un mail :<br>
|
||||
mailto:contact@email.example<br><br>
|
||||
Pour partager des coordonnées géographique :<br>
|
||||
geo:48.867564,2.364057
|
||||
<p>Vous pouvez encoder ce que vous voulez sous forme de texte.</p>
|
||||
<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>
|
||||
<p>Par exemple, pour ouvrir une page Web : <code>https://www.example/</code></p>
|
||||
<p>Pour envoyer un mail : <code>mailto:contact@email.example</code></p>
|
||||
<p>Pour partager des coordonnées géographique : <code>geo:48.867564,2.364057</code></p>
|
||||
",
|
||||
'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.",
|
||||
|
|
@ -37,9 +35,9 @@ $loc = array(
|
|||
'metaText_qr' => "
|
||||
<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.
|
||||
<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",
|
||||
);
|
||||
|
|
|
|||
|
|
@ -11,16 +11,14 @@ $loc = array(
|
|||
'label_mainColor' => "Color del primièr plan",
|
||||
|
||||
'placeholder' => "Dintratz lo tèxt de codar en còdi QR",
|
||||
'placeholder_pixels' => "auto",
|
||||
|
||||
'help_content' => "
|
||||
Podètz pas que codar lo tèxt que volètz.<br>
|
||||
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>
|
||||
Per exemple, per dubrir la pagina web :<br>
|
||||
https://www.example/<br><br>
|
||||
Per enviar un corrièl :<br>
|
||||
mailto:contact@email.example<br><br>
|
||||
Per partejar de coordonadas geograficas :<br>
|
||||
geo:48.867564,2.364057
|
||||
<p>Podètz pas que codar lo tèxt que volètz.</p>
|
||||
<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>
|
||||
<p>Per exemple, per dubrir la pagina web : https://www.example/</p>
|
||||
<p>Per enviar un corrièl : mailto:contact@email.example</p>
|
||||
<p>Per partejar de coordonadas geograficas : geo:48.867564,2.364057</p>
|
||||
",
|
||||
'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.",
|
||||
|
|
@ -37,9 +35,9 @@ $loc = array(
|
|||
'metaText_qr' => "
|
||||
<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.
|
||||
<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",
|
||||
);
|
||||
|
|
|
|||
|
|
@ -77,6 +77,14 @@ a {
|
|||
@media @dark {
|
||||
background-color: @bgHelp-dark;
|
||||
}
|
||||
|
||||
& p {
|
||||
margin-top: 0px;
|
||||
margin-bottom: 8px;
|
||||
&:last-child {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#sideParams {
|
||||
|
|
|
|||
Loading…
Reference in a new issue