Skip to content

Instantly share code, notes, and snippets.

@vperezb
Last active March 29, 2020 17:11
Show Gist options
  • Select an option

  • Save vperezb/f00421b80c931c4b2101e76df5a82c1a to your computer and use it in GitHub Desktop.

Select an option

Save vperezb/f00421b80c931c4b2101e76df5a82c1a to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<!-- For any support contact me on https://www.linkedin.com/in/vperezb-/ or https://www.malt.es/profile/victorperezberruezo-->
<html>
<head>
<meta charset="UTF-8">
<script>
function generateQr() {
var url_redirect = document.getElementById('final_url').value;
var version = document.getElementById('version').value;
var origin = 'qr';
var country = document.getElementById('country').value;
var retailer = document.getElementById('retailer').value;
var width = document.getElementById('qr_size_w').value;
var height = document.getElementById('qr_size_h').value;
url_redirect = encodeURIComponent(url_redirect);
var url_to_qr = 'https://www.malt.es/profile/victorperezberruezo';
url_to_qr = url_to_qr + `?c=${country}&v=${version}&o=${origin}&r=${retailer}&u=${url_redirect}`;
url_to_qr = encodeURIComponent(url_to_qr);
var qrlib = `https://chart.googleapis.com/chart?cht=qr&chs=${width}x${height}&chl=` + url_to_qr;
fetch(qrlib)
.then(res => {
return res.blob()
})
.then(blob => {
var img = URL.createObjectURL(blob);
console.log(img)
// Do whatever with the img
document.getElementById('qr_placeholder').setAttribute('src', img);
})
}
</script>
</head>
<body>
<h1>Tiendeo QR tool</h1>
<h2>Complete the form in order to obtain the QR</h2>
<div style="background-color: #ffcdcd; width:800px;padding: 5px;">
<label for="country">Country:</label>
<br>
<select id="country">
<option value="DEV">DEV</option>
<option value="ES">España</option>
<option value="CO">Colombia</option>
<!--<option value="FR">France</option>
<option value="MX">México</option>
<option value="IT">Italia</option>
<option value="AR">Argentina</option>-->
</select>
<br>
<small>If your country is not on the list contact <a href="#">Helpdesk>Data</a></small>
<br>
<br>
<label for="retailer">Retailer Id: </label>
<br>
<input type="text" id="retailer" name="retailer" size="50" value="0">
<br> Same than in backoffice and everywhere
<br>
<br>
<label for="final_url">Final url: </label>
<br>
<input type="text" id="final_url" name="final_url" size="100" value="https://www.tiendeo.com?utm_source=tiendeo?utm_medium=qr_test">
<br>
<small>The one we want to direct the traffic</small>
<br>
<br>
<label for="version">Identifyier: </label>
<br>
<input type="text" id="version" name="version" size="50" value="test_1">
<br>
<strong>Do not use special characters.</strong><small>Use it if you want to create multiple QRs</small>
<br>
<br>
<label for="qr_size_w">QR Width: </label>
<br>
<input type="text" id="qr_size_w" size="50" name="qr_size_w" value=200>
<br>
<label for="qr_size_h">QR Height: </label>
<br>
<input type="text" id="qr_size_h" size="50" name="qr_size_h" value=200>
<br>
<br>
<button onclick="generateQr()">Generate QR</button>
</div>
</body>
</html>
<script>
function httpGet(theUrl)
{
var xmlHttp = new XMLHttpRequest();
xmlHttp.open("GET", theUrl, false); // false for synchronous request
xmlHttp.send(null);
return xmlHttp.responseText;
}
</script>
<img id='qr_placeholder' src='placeholder.jpg'></img>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment