Files
BarangaySystem/legacy/pages-html/slvl/all/bet-qr
2026-06-06 18:43:00 +08:00

437 lines
10 KiB
Plaintext

<br><br>
<div class="card noprint" id="secondary-card">
<div class="card-header ui-sortable-handle" style="cursor: move;display: none;">
<h3 class="card-title" style=""></h3>
<div class="card-tools">
</div>
</div>
<div class="card-body ">
<div class="row card-body">
<div class="col-12"></div><br><br>
<div class="col-12 mx-auto d-block text-center justify-content-center noprint" id="qrcode"></div>
</div>
</div>
</div>
<div class="card noprint" id="secondary-card-betting">
<div class="card-header ui-sortable-handle" style="cursor: move;display: none;">
<h3 class="card-title" style=""></h3>
<div class="card-tools">
</div>
</div>
<div class="card-body">
<div class="row card-body noprint">
<div class="col mx-auto noprint" style="display:none;" id="">
<button class="btn btn-primary btn-block" onclick="DownloadQRCodeNow()">SAVE</button>
</div>
<div class="col mx-auto noprint" id="">
<button class="btn btn-warning btn-block" onclick="printbtqr()">PRINT</button>
</div>
</div>
<div class="row card-body" style="display:none;">
<div class="col mx-auto" id="">
Date:
</div>
<div class="col mx-auto" id="">
<select id="sched" class="form-control"></select>
</div>
</div>
</div>
</div>
<center>
<div id="qrcodeprinting" class="mainprint hideonbrowser"></div>
</center>
<script>
function printbtqr(){
window.print();
//printJS({ printable: "mainqrimg", type: "html",});
}
function OLDsavebtqr(){
let b64 = $('.mainbtqr').attr('src');
let base64Data = b64.split(',')[1];
let decodedData = atob(base64Data);
let uint8Array = new Uint8Array(decodedData.length);
for (let i = 0; i < decodedData.length; i++) {
uint8Array[i] = decodedData.charCodeAt(i);
}
const blob = new Blob([uint8Array], { type: "image/png" });
const url = URL.createObjectURL(blob);
const link = document.createElement("a");
link.href = url;
link.download = "NewQ.png";
link.click();
URL.revokeObjectURL(url);
}
function OLD2savebtqr() {
let b64 = $('.mainbtqr').attr('src');
let base64Data = b64.split(',')[1];
let decodedData = atob(base64Data);
let uint8Array = new Uint8Array(decodedData.length);
for (let i = 0; i < decodedData.length; i++) {
uint8Array[i] = decodedData.charCodeAt(i);
}
const blob = new Blob([uint8Array], { type: "image/png" });
// Check if the browser is Internet Explorer (MS Edge)
if (navigator.msSaveOrOpenBlob) {
navigator.msSaveOrOpenBlob(blob, 'NewQ.png');
} else {
const url = URL.createObjectURL(blob);
const link = document.createElement("a");
link.href = url;
link.download = "NewQ.png";
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
}
}
function savebtqr() {
let b64 = $('.mainbtqr').attr('src');
let base64Data = b64.split(',')[1];
let decodedData = atob(base64Data);
let uint8Array = new
Uint8Array(decodedData.length);
for (let i = 0; i < decodedData.length; i++) {
uint8Array[i] = decodedData.charCodeAt(i);
}
const blob = new Blob([uint8Array], { type: "image/png" });
// Cross-browser download approach:
try {
// Attempt saving via browser's native download manager:
const url = URL.createObjectURL(blob);
const link = document.createElement("a");
link.href = url;
link.download = "NewQRCode.png";
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
} catch (error) {
// Fallback for mobile browsers with limitations:
const reader = new FileReader();
reader.onload = (event) => {
const base64Url = event.target.result;
const img = document.createElement("img");
img.src = base64Url;
// Use a mobile-friendly method to display or share the image
// (e.g., open a new window/tab, trigger native share functionality)
};
reader.readAsDataURL(blob);
}
}
function oldsaveQrCode() {
// Get the base64 data
let b64 = document.getElementById('mainqrimg').src;
let base64Data = b64.split(',')[1];
// Create a Blob from base64 data
const blob = new Blob([base64Data], { type: "image/png" });
// Create a link element
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
link.download = "QrCode.png";
// Append the link to the body
document.body.appendChild(link);
// Trigger a click on the link
link.click();
// Remove the link from the body
document.body.removeChild(link);
// Revoke the object URL
URL.revokeObjectURL(link.href);
}
function saveQrCode2() {
// Get the base64 data
let b64 = document.getElementById('mainqrimg').src;
// Create a canvas element
const canvas = document.createElement("canvas");
const context = canvas.getContext("2d");
// Create an image element
const image = new Image();
image.onload = function () {
// Set canvas dimensions based on image dimensions
canvas.width = image.width;
canvas.height = image.height;
// Draw the image onto the canvas
context.drawImage(image, 0, 0);
// Convert canvas content to a data URL
const dataUrl = canvas.toDataURL("image/png");
// Create a Blob from the data URL
const blob = dataURLToBlob(dataUrl);
// Create a link element
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
link.download = "QrCode.png";
// Append the link to the body
document.body.appendChild(link);
// Trigger a click on the link
link.click();
// Remove the link from the body
document.body.removeChild(link);
// Revoke the object URL
URL.revokeObjectURL(link.href);
};
// Set the image source
image.src = b64;
}
function oldsaveQrCode() {
// Get the base64 data
let b64 = document.getElementById('mainqrimg').src;
let base64Data = b64.split(',')[1];
// Create a Blob from base64 data
const blob = new Blob([base64Data], { type: "image/png" });
// Create a link element
const link = document.createElement("a");
link.href = URL.createObjectURL(blob);
link.download = "QrCode.png";
// Append the link to the body
document.body.appendChild(link);
// Trigger a click on the link
link.click();
// Remove the link from the body
document.body.removeChild(link);
// Revoke the object URL
URL.revokeObjectURL(link.href);
}
function saveQrCode3() {
// Get the base64 data
let b64 = document.getElementById('mainqrimg').src;
const base64Content = b64.split(',')[1];
const binaryContent = atob(base64Content);
const uint8Array = new Uint8Array(binaryContent.length);
for (let i = 0; i < binaryContent.length; i++) {
uint8Array[i] = binaryContent.charCodeAt(i);
}
// Create a Blob
const blob = new Blob([uint8Array], { type: 'image/png' });
// Create a download link
const link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.download = 'QrCode.png';
// Append the link to the body
document.body.appendChild(link);
// Trigger a click on the link
link.click();
// Remove the link from the body
document.body.removeChild(link);
// Revoke the object URL
URL.revokeObjectURL(link.href);
}
function saveQrCode() {
// Get the base64 data
let b64 = document.getElementById('mainqrimg').src;
let base64Data = b64.split(',')[1];
// Convert base64 to a Blob
const byteCharacters = atob(base64Data);
const byteNumbers = new Array(byteCharacters.length);
for (let i = 0; i < byteCharacters.length; i++) {
byteNumbers[i] = byteCharacters.charCodeAt(i);
}
const byteArray = new Uint8Array(byteNumbers);
const blob = new Blob([byteArray], { type: 'image/png' });
// Use FileSaver.js to trigger the download
saveAs(blob, 'QrCode.png');
}
// Function to convert data URL to Blob
function dataURLToBlob(dataUrl) {
const parts = dataUrl.split(';base64,');
const contentType = parts[0].split(':')[1];
const raw = window.atob(parts[1]);
const rawLength = raw.length;
const uint8Array = new Uint8Array(new ArrayBuffer(rawLength));
for (let i = 0; i < rawLength; ++i) {
uint8Array[i] = raw.charCodeAt(i);
}
return new Blob([uint8Array], { type: contentType });
}
new QRCode(document.getElementById("qrcode"), "TAYTRSRC="+currenttarget,);
new QRCode("qrcodeprinting", {
text: "TAYTRSRC="+currenttarget,
width: 1000,
height: 1000,
colorDark : "#000000",
colorLight : "#ffffff",
correctLevel : QRCode.CorrectLevel.H
});
// new QRCode(document.getElementById("qrcode"), "TAYTRSRC="+currenttarget);
$("#qrcode").find("img").addClass("img-fluid mx-auto d-block noprint");
$("#qrcode").find("img").addClass("mainbtqr");
// $("#qrcode").find("img").prepend('<br>');
//$("#qrcode").find('canvas').attr('width')=screen.width-40+'px';
//$("#qrcode").find("img").attr("id", "mainqrimg");
$("#mainqrimg").attr("width", screen.width-40+'px');
$("#qrcodeprinting").find("img").addClass("mainprint");
$("#qrcodeprinting").find("img").attr("id", "mainqrimg");
// $("#qrcodeprinting").find("img").hide();
console.log("QR Download Button:", $("#qrdownloadbutton").length);
console.log("Main QR Image:", $("#mainqrimg").attr("src"));
$("#qrdownloadbutton").attr("href", $("#mainqrimg").attr("src"));
$("#mainqrimg").on("load", function() {
//$("#qrdownloadbutton").attr("href", $("#mainqrimg").attr("src"));
});
$("#qrdownloadbutton").on("click", function() {
downloadQRCode();
});
function downloadQRCode() {
const base64Data = $("#mainqrimg").attr("src").split(",")[1];
const decodedData = atob(base64Data);
const uint8Array = new Uint8Array(decodedData.length);
for (let i = 0; i < decodedData.length; i++) {
uint8Array[i] = decodedData.charCodeAt(i);
}
const blob = new Blob([uint8Array], { type: "image/png" });
const url = URL.createObjectURL(blob);
const link = document.createElement("a");
link.href = url;
link.download = "NewQr.png";
link.click();
URL.revokeObjectURL(url);
}
$(document).ready(function() {
$('#qrcode').find('canvas').attr('id', 'qrcode-canvas');
$('#qrcode').find('img').attr('id', 'qrcode-image');
});
function DownloadQRCodeNow(){
let img = document.getElementById('qrcode-image');
let canvas = document.getElementById('qrcode-canvas');
canvas.width = img.clientWidth;
canvas.height = img.clientHeight;
let context = canvas.getContext('2d');
context.drawImage(img,0,0)
canvas.toBlob(function(blob){
let link = document.createElement('a');
link.download = 'qrcode.png';
link.href = URL.createObjectURL(blob);
link.click();
URL.revokeObjectURL(link.href);
},'image/png');
}
</script>
<style>
.hideonbrowser {
display: none;
}
</style>