100 lines
3.5 KiB
JavaScript
100 lines
3.5 KiB
JavaScript
//Clipboard stuff
|
|
const baseurl = "https://kauft.es";
|
|
const btn = document.getElementById("shorturl_copy");
|
|
const clipboard = new ClipboardJS(btn);
|
|
clipboard.on('success', function (e) {
|
|
console.info('Action:', e.action);
|
|
console.info('Text:', e.text);
|
|
new Notification('Copied Shorturl', {
|
|
icon: 'https://git.odit.services/user/avatar/kauft.es/140',
|
|
body: `Copied the shorturl to your clipboard: ${e.text}`,
|
|
});
|
|
});
|
|
|
|
//Set default url as current tab
|
|
chrome.tabs.query({ active: true, lastFocusedWindow: true }, tabs => {
|
|
document.getElementById("target").value = tabs[0].url;
|
|
});
|
|
|
|
// Create button click handler calls the api to create a new short url
|
|
document.getElementById("create").onclick = createUrl;
|
|
|
|
/**
|
|
* Calls the api to create a new short url and handels displaying the ui for "created" urls
|
|
*/
|
|
function createUrl() {
|
|
let shorturl = {
|
|
target: document.getElementById("target").value,
|
|
shortcode: document.getElementById("shortcode").value
|
|
};
|
|
|
|
if (shorturl.shortcode == "" | !shorturl.shortcode) {
|
|
delete shorturl.shortcode;
|
|
}
|
|
|
|
fetch(`${baseurl}/api`, {
|
|
method: "POST",
|
|
body: JSON.stringify(shorturl),
|
|
headers: new Headers({
|
|
'Content-Type': 'application/json'
|
|
})
|
|
})
|
|
.then(res => {
|
|
if (!res.ok) {
|
|
handleError(res);
|
|
}
|
|
else {
|
|
res.json()
|
|
}
|
|
})
|
|
.then(res => {
|
|
document.getElementById("shorturl").innerText = res.url;
|
|
document.getElementById("shorturl_container").className = "";
|
|
document.getElementById("target_container").className = "hidden";
|
|
document.getElementById("shortcode_container").className = "hidden";
|
|
document.getElementById("create").classList.add("hidden");
|
|
document.getElementById("reset").classList.remove("hidden");
|
|
});
|
|
|
|
}
|
|
|
|
//Add error dismiss event handler
|
|
document.getElementById("error_dismiss").onclick = () => {
|
|
document.getElementById("error_container").classList.add("hidden");
|
|
};
|
|
|
|
/**
|
|
* Display alerts for errors (only handling 400 correctly r/n)
|
|
* @param {response} res The fetch response object
|
|
*/
|
|
function handleError(res) {
|
|
if (res.status == 400) {
|
|
res.text().then((body) => {
|
|
document.getElementById("error_text").innerText = body;
|
|
document.getElementById("error_container").classList.remove("hidden");
|
|
})
|
|
}
|
|
else {
|
|
console.log(res);
|
|
document.getElementById("error_text").innerText = "An unknown error occured (see console for more details)";
|
|
document.getElementById("error_container").classList.remove("hidden");
|
|
}
|
|
}
|
|
|
|
//Add ui reset error handler
|
|
document.getElementById("reset").onclick = reset;
|
|
|
|
/**
|
|
* Resets the ui by emtying/resetting all inputs and showing the "default" home ui containers again.
|
|
*/
|
|
function reset() {
|
|
document.getElementById("shorturl").innerText = "";
|
|
document.getElementById("shorturl_container").className = "hidden";
|
|
document.getElementById("reset").classList.add("hidden");
|
|
chrome.tabs.query({ active: true, lastFocusedWindow: true }, tabs => {
|
|
document.getElementById("target").value = tabs[0].url;
|
|
document.getElementById("target_container").className = "";
|
|
document.getElementById("shortcode_container").className = "";
|
|
document.getElementById("create").classList.remove("hidden");
|
|
});
|
|
} |