miraty
/
libreqr
1
1
Fork 2
Code Issues Pull Requests Releases 7 Activity
Browse Source

Merge main and body

main
Miraty 4 months ago
parent
108da9d050
commit
f6dbce3b97
2 changed files with 149 additions and 156 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 280
      index.php
  2. 25
      style.less

280
index.php
View File

@ -124,180 +124,176 @@ if (
<body>
<main>
<header>
<a id="linkTitles" href="./">
<div id="titles">
<h1>LibreQR</h1>
<h2><?= $loc['subtitle'] ?></h2>
</div>
</a>
</header>
<header>
<a id="linkTitles" href="./">
<div id="titles">
<h1>LibreQR</h1>
<h2><?= $loc['subtitle'] ?></h2>
</div>
</a>
</header>
<form method="post" action="./#output">
<div id="firstWrapper">
<form method="post" action="./#output">
<div class="param" id="txtParam">
<details>
<summary><label for="txt"><?= $loc['label_content'] ?></label></summary>
<div class="helpText">
<?= $loc['help_content'] ?>
</div>
</details>
<textarea rows="8" required="" id="txt" placeholder="<?= $loc['placeholder'] ?>" name="txt"><?= htmlspecialchars($params['txt']) ?></textarea>
</div>
<div id="firstWrapper">
<div id="sideParams">
<div class="param" id="txtParam">
<div class="param">
<details>
<summary><label for="txt"><?= $loc['label_content'] ?></label></summary>
<div class="helpText">
<?= $loc['help_content'] ?>
</div>
<summary><label for="redundancy"><?= $loc['label_redundancy'] ?></label></summary>
<p class="helpText">
<?= $loc['help_redundancy'] ?>
</p>
</details>
<textarea rows="8" required="" id="txt" placeholder="<?= $loc['placeholder'] ?>" name="txt"><?= htmlspecialchars($params['txt']) ?></textarea>
<select id="redundancy" name="redundancy">
<option <?php if ($params['redundancy'] === "low") echo 'selected="" '; ?>value="low">L - 7%</option>
<option <?php if ($params['redundancy'] === "medium") echo 'selected="" '; ?>value="medium">M - 15%</option>
<option <?php if ($params['redundancy'] === "quartile") echo 'selected="" '; ?>value="quartile">Q - 25%</option>
<option <?php if ($params['redundancy'] === "high") echo 'selected="" '; ?>value="high">H - 30%</option>
</select>
</div>
<div id="sideParams">
<div class="param">
<details>
<summary><label for="redundancy"><?= $loc['label_redundancy'] ?></label></summary>
<p class="helpText">
<?= $loc['help_redundancy'] ?>
</p>
</details>
<select id="redundancy" name="redundancy">
<option <?php if ($params['redundancy'] === "low") echo 'selected="" '; ?>value="low">L - 7%</option>
<option <?php if ($params['redundancy'] === "medium") echo 'selected="" '; ?>value="medium">M - 15%</option>
<option <?php if ($params['redundancy'] === "quartile") echo 'selected="" '; ?>value="quartile">Q - 25%</option>
<option <?php if ($params['redundancy'] === "high") echo 'selected="" '; ?>value="high">H - 30%</option>
</select>
</div>
<div class="param">
<details>
<summary><label for="margin"><?= $loc['label_margin'] ?></label></summary>
<p class="helpText">
<?= $loc['help_margin'] ?>
</p>
</details>
<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">
<details>
<summary><label for="size"><?= $loc['label_size'] ?></label></summary>
<p class="helpText">
<?= $loc['help_size'] ?>
</p>
</details>
<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 class="param">
<details>
<summary><label for="margin"><?= $loc['label_margin'] ?></label></summary>
<p class="helpText">
<?= $loc['help_margin'] ?>
</p>
</details>
<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">
<details>
<summary><label for="size"><?= $loc['label_size'] ?></label></summary>
<p class="helpText">
<?= $loc['help_size'] ?>
</p>
</details>
<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>
<div id="colors">
</div>
<div class="param">
<label for="bgColor"><?= $loc['label_bgColor'] ?></label>
<div class="inputColorContainer">
<input type="color" name="bgColor" id="bgColor" value="#<?= htmlspecialchars($params['bgColor']) ?>">
</div>
</div>
<div id="colors">
<div class="param">
<label for="mainColor"><?= $loc['label_mainColor'] ?></label>
<div class="inputColorContainer">
<input type="color" name="mainColor" id="mainColor" value="#<?= htmlspecialchars($params['mainColor']) ?>">
</div>
<div class="param">
<label for="bgColor"><?= $loc['label_bgColor'] ?></label>
<div class="inputColorContainer">
<input type="color" name="bgColor" id="bgColor" value="#<?= htmlspecialchars($params['bgColor']) ?>">
</div>
</div>
<div class="centered">
<input class="button" type="submit" value="<?= $loc['button_create'] ?>" />
<div class="param">
<label for="mainColor"><?= $loc['label_mainColor'] ?></label>
<div class="inputColorContainer">
<input type="color" name="mainColor" id="mainColor" value="#<?= htmlspecialchars($params['mainColor']) ?>">
</div>
</div>
</div>
</form>
<?php
if ($validFormSubmitted) {
$rgbBgColor = array(
'r' => hexdec(substr($params['bgColor'],0,2)),
'g' => hexdec(substr($params['bgColor'],2,2)),
'b' => hexdec(substr($params['bgColor'],4,2)),
);
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'])
->setErrorCorrection($params['redundancy'])
->setForegroundColor(array(
'r' => hexdec(substr($params['mainColor'],0,2)),
'g' => hexdec(substr($params['mainColor'],2,2)),
'b' => hexdec(substr($params['mainColor'],4,2)),
))
->setBackgroundColor($rgbBgColor)
->setImageType(QrCode::IMAGE_TYPE_PNG);
$dataUri = $qrCode->getDataUri();
$qrSize = $qrCode->getSize() + 2 * $qrCode->getPadding();
?>
<section id="output">
<div class="centered" id="downloadQR">
<a href="<?= $dataUri ?>" class="button" download="<?= htmlspecialchars($params['txt']); ?>.png"><?= $loc['button_download'] ?></a>
</div>
<div class="centered">
<input class="button" type="submit" value="<?= $loc['button_create'] ?>" />
</div>
<div class="centered" id="showOnlyQR">
<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"<?php
</form>
// Compute the difference between the QR code and theme background colors
$diffLight = abs($rgbBgColor['r']-hexdec(substr($colorScheme['bg-light'],-6,2))) + abs($rgbBgColor['g']-hexdec(substr($colorScheme['bg-light'],-4,2))) + abs($rgbBgColor['b']-hexdec(substr($colorScheme['bg-light'],-2,2)));
$diffDark = abs($rgbBgColor['r']-hexdec(substr($colorScheme['bg-dark'],-6,2))) + abs($rgbBgColor['g']-hexdec(substr($colorScheme['bg-dark'],-4,2))) + abs($rgbBgColor['b']-hexdec(substr($colorScheme['bg-dark'],-2,2)));
<?php
// Determine whether a CSS corner is needed to let the user see the margin of the QR code
$contrastThreshold = 64;
if ($diffLight < $contrastThreshold)
echo " class='needLightContrast'";
if ($diffDark < $contrastThreshold)
echo " class='needDarkContrast'";
?> src="<?= $dataUri ?>"></a>
</div>
</section>
if ($validFormSubmitted) {
$rgbBgColor = array(
'r' => hexdec(substr($params['bgColor'],0,2)),
'g' => hexdec(substr($params['bgColor'],2,2)),
'b' => hexdec(substr($params['bgColor'],4,2)),
);
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'])
->setErrorCorrection($params['redundancy'])
->setForegroundColor(array(
'r' => hexdec(substr($params['mainColor'],0,2)),
'g' => hexdec(substr($params['mainColor'],2,2)),
'b' => hexdec(substr($params['mainColor'],4,2)),
))
->setBackgroundColor($rgbBgColor)
->setImageType(QrCode::IMAGE_TYPE_PNG);
$dataUri = $qrCode->getDataUri();
$qrSize = $qrCode->getSize() + 2 * $qrCode->getPadding();
?>
<section id="output">
<div class="centered" id="downloadQR">
<a href="<?= $dataUri ?>" class="button" download="<?= htmlspecialchars($params['txt']); ?>.png"><?= $loc['button_download'] ?></a>
</div>
<?php } ?>
<div class="centered" id="showOnlyQR">
<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"<?php
<footer>
// Compute the difference between the QR code and theme background colors
$diffLight = abs($rgbBgColor['r']-hexdec(substr($colorScheme['bg-light'],-6,2))) + abs($rgbBgColor['g']-hexdec(substr($colorScheme['bg-light'],-4,2))) + abs($rgbBgColor['b']-hexdec(substr($colorScheme['bg-light'],-2,2)));
$diffDark = abs($rgbBgColor['r']-hexdec(substr($colorScheme['bg-dark'],-6,2))) + abs($rgbBgColor['g']-hexdec(substr($colorScheme['bg-dark'],-4,2))) + abs($rgbBgColor['b']-hexdec(substr($colorScheme['bg-dark'],-2,2)));
<section id="info" class="metaText">
<?= $loc['metaText_qr'] ?>
</section>
// Determine whether a CSS corner is needed to let the user see the margin of the QR code
$contrastThreshold = 64;
if ($diffLight < $contrastThreshold)
echo " class='needLightContrast'";
if ($diffDark < $contrastThreshold)
echo " class='needDarkContrast'";
?> src="<?= $dataUri ?>"></a>
</div>
</section>
<?php if (CUSTOM_TEXT_ENABLED) { ?>
<section class="metaText">
<?= CUSTOM_TEXT ?>
</section>
<?php } ?>
<?php } ?>
<footer>
<section id="info" class="metaText">
<?= $loc['metaText_qr'] ?>
</section>
<?php if (CUSTOM_TEXT_ENABLED) { ?>
<section class="metaText">
<?= $loc['metaText_legal'] ?>
<?= CUSTOM_TEXT ?>
</section>
<?php } ?>
</footer>
<section class="metaText">
<?= $loc['metaText_legal'] ?>
</section>
</main>
</footer>
</body>
</html>

25
style.less
View File

@ -32,10 +32,18 @@ html {
}
body {
display: flex;
flex-direction: column;
width: 814px;
height: 100%;
margin: 0px;
margin-left: auto;
margin-right: auto;
font-weight: normal;
font-size: 20px;
height: 100%;
@media @light {
color: @text-light;
@ -170,15 +178,6 @@ summary {
text-decoration: none;
}
main {
display: flex;
flex-direction: column;
margin-left: auto;
margin-right: auto;
width: 814px;
height: 100%;
}
header {
text-align: center;
padding-top: 12px;
@ -230,10 +229,8 @@ h2 {
}
.param {
padding: 10px;
padding-left: 0px;
padding: 4px;
margin-left: 0px;
padding-right: 0px;
margin-right: 0px;
}
@ -458,7 +455,7 @@ input[type=submit] {
@media (max-width: 850px) {
main {
body {
width: auto;
}

Write Preview
Loading…
Cancel
Save