Verified Commit fb52e7c3 authored by Thibaut Broggi's avatar Thibaut Broggi
Browse files

Fix bugs on page load without parameters

parent fad47731
Pipeline #1363 passed with stage
in 33 seconds
...@@ -91,29 +91,22 @@ let draw = function() { ...@@ -91,29 +91,22 @@ let draw = function() {
// Update download button // Update download button
document.querySelector('#save-image').href = canvas.toDataURL(); document.querySelector('#save-image').href = canvas.toDataURL();
// Edit URL
history.replaceState('', '', window.location.pathname + '?'
+ 'bg-color=' + encodeURIComponent(bgColor)
+ '&fg-color=' + encodeURIComponent(fgColor)
+ '&text=' + encodeURIComponent(fillText)
+ '&font=' + encodeURIComponent(font)
+ '&icon=' + encodeURIComponent(icon)
+ '&signature=' + encodeURIComponent(signature)
+ window.location.hash);
// Update tweet button
document.getElementById('tweet-button').href = 'https://twitter.com/intent/tweet?text=Soutenez La Quadrature du Net ! ' + encodeURIComponent(window.location.href);
}, false); }, false);
}); });
// Edit URL
history.replaceState('', '', window.location.pathname + '?'
+ 'bg-color=' + encodeURIComponent(bgColor)
+ '&fg-color=' + encodeURIComponent(fgColor)
+ '&text=' + encodeURIComponent(fillText)
+ '&font=' + encodeURIComponent(font)
+ '&icon=' + encodeURIComponent(icon)
+ '&signature=' + encodeURIComponent(signature)
+ window.location.hash);
// Update tweet button
document.getElementById('tweet-button').href = 'https://twitter.com/intent/tweet?text=Soutenez La Quadrature du Net ! ' + encodeURIComponent(window.location.href);
}
let bgColorElems = document.querySelectorAll('.colorpicker input[type="radio"], #step3 input[type="radio"], #step4 input[type="radio"]');
for (let i = 0; i < bgColorElems.length; ++i) {
bgColorElems[i].onchange = draw;
} }
document.getElementById('step2value').oninput = draw;
document.getElementById('signature').oninput = draw;
let navElems = document.querySelectorAll('nav > a'); let navElems = document.querySelectorAll('nav > a');
for (let i = 0; i < navElems.length; ++i) { for (let i = 0; i < navElems.length; ++i) {
...@@ -139,23 +132,33 @@ window.onload = function() { ...@@ -139,23 +132,33 @@ window.onload = function() {
document.querySelector('nav > a[href="' + hash + '"]').click(); document.querySelector('nav > a[href="' + hash + '"]').click();
// Update inputs depending on URL params // Update inputs depending on URL params
let splitParams = window.location.search.split('?')[1].split('&'); if (window.location.search) {
let params = {}; let splitParams = window.location.search.split('?')[1].split('&');
for (let i in splitParams) { let params = {};
params[splitParams[i].split('=')[0]] = decodeURIComponent(splitParams[i].split('=')[1]); for (let i in splitParams) {
params[splitParams[i].split('=')[0]] = decodeURIComponent(splitParams[i].split('=')[1]);
}
if (params['bg-color'])
document.querySelector('.colorpicker input[name="bg-color"][value="' + params['bg-color'] + '"]').checked = true;
if (params['fg-color'])
document.querySelector('.colorpicker input[name="fg-color"][value="' + params['fg-color'] + '"]').checked = true;
if (params['text'])
document.getElementById('step2value').value = document.getElementById('step2value').innerText = params['text'];
if (params['font'])
document.querySelector('input[name="font"][value="' + params['font'] + '"]').checked = true;
if (params['icon'])
document.querySelector('input[name="icon"][value="' + params['icon'] + '"]').checked = true;
if (params['signature'])
document.getElementById('signature').value = params['signature'];
}
// Add event listeners to inputs
let bgColorElems = document.querySelectorAll('.colorpicker input[type="radio"], #step3 input[type="radio"], #step4 input[type="radio"]');
for (let i = 0; i < bgColorElems.length; ++i) {
bgColorElems[i].onchange = draw;
} }
if (params['bg-color']) document.getElementById('step2value').oninput = draw;
document.querySelector('.colorpicker input[name="bg-color"][value="' + params['bg-color'] + '"]').checked = true; document.getElementById('signature').oninput = draw;
if (params['fg-color'])
document.querySelector('.colorpicker input[name="fg-color"][value="' + params['fg-color'] + '"]').checked = true;
if (params['text'])
document.getElementById('step2value').value = document.getElementById('step2value').innerText = params['text'];
if (params['font'])
document.querySelector('input[name="font"][value="' + params['font'] + '"]').checked = true;
if (params['icon'])
document.querySelector('input[name="icon"][value="' + params['icon'] + '"]').checked = true;
if (params['signature'])
document.getElementById('signature').value = params['signature'];
// Update canvas // Update canvas
draw(); draw();
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment