+
+ {
+ data.data.text().then(text => {
+ data.data = text;
+ createStringPasteUi(data, "application/octet-stream", name);
+ })
+ }}>Display anyways?
+ ;
- const mainEle = document.createElement("main");
- mainEle.classList.add("hljs");
- mainEle.classList.add("centered");
- mainEle.classList.add("fullscreen");
-
- const divEle = document.createElement("div");
- divEle.classList.add("centered");
-
- const expirationEle = document.createElement("p");
- expirationEle.textContent = data.expiration;
- divEle.appendChild(expirationEle);
-
- const downloadEle = document.createElement("a");
- downloadEle.href = getObjectUrl(data.data, name);
- downloadEle.download = name;
- downloadEle.classList.add("hljs-meta");
- downloadEle.textContent = "Download binary file.";
- divEle.appendChild(downloadEle);
-
- mainEle.appendChild(divEle);
-
- const displayAnywayEle = document.createElement("p");
- displayAnywayEle.classList.add("display-anyways");
- displayAnywayEle.classList.add("hljs-comment");
- displayAnywayEle.textContent = "Display anyways?";
- displayAnywayEle.onclick = () => {
- data.data.text().then(text => {
- data.data = text;
- createStringPasteUi(data, "application/octet-stream", name);
- })
- };
- mainEle.appendChild(displayAnywayEle);
- bodyEle.appendChild(mainEle);
+ ReactDom.render(html, document.body);
}
function createImagePasteUi({ expiration, data, file_size }, name: string, mimeType: string) {
@@ -235,39 +201,6 @@ function createVideoPasteUi({ expiration, data }, name: string, mimeType: string
}
function createArchivePasteUi({ expiration, data, entries }, name: string) {
- const bodyEle = document.getElementsByTagName("body")[0];
- bodyEle.textContent = '';
-
- const mainEle = document.createElement("main");
-
- const sectionEle = document.createElement("section");
- sectionEle.classList.add("paste");
-
- const expirationEle = document.createElement("p");
- expirationEle.textContent = expiration;
- expirationEle.classList.add("centered");
- sectionEle.appendChild(expirationEle);
-
- const downloadEle = document.createElement("a");
- downloadEle.href = getObjectUrl(data);
- downloadEle.download = name;
- downloadEle.textContent = "Download";
- downloadEle.classList.add("hljs-meta");
- downloadEle.classList.add("centered");
- sectionEle.appendChild(downloadEle);
-
- sectionEle.appendChild(document.createElement("hr"));
-
- const mediaEle = document.createElement("table");
- mediaEle.classList.add("archive-table");
- const tr = mediaEle.insertRow();
- tr.classList.add("hljs-title");
- const tdName = tr.insertCell();
- tdName.textContent = "Name";
- const tdSize = tr.insertCell();
- tdSize.classList.add("align-right");
- tdSize.textContent = "File Size";
-
// Because it's a stable sort, we can first sort by name (to get all folder
// items grouped together) and then sort by if there's a / or not.
entries.sort((a, b) => {
@@ -280,23 +213,32 @@ function createArchivePasteUi({ expiration, data, entries }, name: string) {
return b.name.includes("/") - a.name.includes("/");
});
- for (const { name, file_size } of entries) {
- const tr = mediaEle.insertRow();
- const tdName = tr.insertCell();
- tdName.textContent = name;
- const tdSize = tr.insertCell();
- tdSize.textContent = file_size;
- tdSize.classList.add("align-right");
- tdSize.classList.add("hljs-number");
- }
+ const html =