From c5dfb76160898426260efeb94f09f88142609ce6 Mon Sep 17 00:00:00 2001 From: Hans5958 Date: Wed, 21 Jun 2023 17:29:39 +0700 Subject: [PATCH] Add Submit Direct to GitHub and Copy button --- web/_js/config.js | 3 ++ web/_js/main/draw.js | 100 +++++++++++++++++++++++++++++++------------ web/index.html | 8 +++- 3 files changed, 82 insertions(+), 29 deletions(-) diff --git a/web/_js/config.js b/web/_js/config.js index ba842028..21d3a530 100644 --- a/web/_js/config.js +++ b/web/_js/config.js @@ -11,6 +11,9 @@ window.instanceId = instanceId const instanceSubreddit = "placeAtlas2" window.instanceSubreddit = instanceSubreddit +const instanceRepo = "https://github.com/placeAtlas/atlas" +window.instanceRepo = instanceRepo + const pageTitle = "The 2022 r/place Atlas" window.pageTitle = pageTitle diff --git a/web/_js/main/draw.js b/web/_js/main/draw.js index cd1c0763..f96dc76b 100644 --- a/web/_js/main/draw.js +++ b/web/_js/main/draw.js @@ -24,8 +24,10 @@ const periodsAdd = document.getElementById('periodsAdd') const exportButton = document.getElementById("exportButton") const cancelButton = document.getElementById("cancelButton") -const exportDirectPostButton = document.getElementById("exportDirectPost") -let exportDirectPostTooltip = null +const redditPostButton = document.getElementById("exportRedditPost") +let redditPostTooltip = null +const githubPostButton = document.getElementById("exportGithubPost") +let githubPostTooltip = null const exportModalElement = document.getElementById("exportModal") const exportModal = new bootstrap.Modal(exportModalElement) @@ -86,6 +88,17 @@ baseInputField.type = "text" }) }) +// https://gist.github.com/codeguy/6684588?permalink_comment_id=3243980#gistcomment-3243980 +function slugify(text) { + return text + .normalize('NFKD') + .toLowerCase() + .trim() + .replace(/\s+/g, '-') + .replace(/[^\w\-]+/g, '') + .replace(/\-+/g, '-'); +} + window.initDraw = initDraw function initDraw() { // Adds exit draw button and removes list button @@ -303,43 +316,76 @@ function initDraw() { return exportObject } + document.getElementById("exportCopy").addEventListener("click", () => { + navigator.clipboard.writeText(exportArea.value) + }) + function exportJson() { const exportObject = generateExportObject() + const prettyJsonString = JSON.stringify(exportObject, null, "\t") + const miniJsonString = JSON.stringify(exportObject) - let prettyJsonString = JSON.stringify(exportObject, null, "\t") - prettyJsonString = " " + prettyJsonString.split("\n").join("\n ") - exportArea.value = prettyJsonString - let directPostJsonString = prettyJsonString - - let directPostUrl = `https://www.reddit.com/r/${instanceSubreddit}/submit?selftext=true&title=` - if (exportObject.id === 0) directPostUrl += `✨%20${encodeURIComponent(exportObject.name)}` - else directPostUrl += `✏%20${encodeURIComponent(exportObject.name)}` - directPostUrl += "&text=" + // Export area - if (directPostJsonString.length + directPostJsonString > 7579) { - directPostJsonString = " " + JSON.stringify(exportObject) - } + exportArea.value = " " + prettyJsonString.split("\n").join("\n ") if (exportArea.value > 40000) { - exportArea.value = " " + JSON.stringify(exportObject) + exportArea.value = " " + miniJsonString } - directPostUrl += encodeURIComponent(directPostJsonString) + + // Reddit - if (directPostUrl.length > 7579) { - // exportDirectPostButton.classList.add("disabled") - // exportDirectPostButton.ariaDisabled = true - exportDirectPostButton.dataset.bsToggle = "tooltip" - exportDirectPostButton.dataset.bsTitle = "This may not work due to the length of the entry. If needed, please copy manually." - if (!exportDirectPostTooltip) exportDirectPostTooltip = new bootstrap.Tooltip(exportDirectPostButton) - } else { - // exportDirectPostButton.classList.remove("disabled") - // exportDirectPostButton.ariaDisabled = false - exportDirectPostButton.dataset.bsTitle = "" + let redditPostJsonString = " " + prettyJsonString.split("\n").join("\n ") + let redditPostUrl = `https://www.reddit.com/r/${instanceSubreddit}/submit?selftext=true&title=` + if (exportObject.id === 0) redditPostUrl += `✨%20${encodeURIComponent(exportObject.name)}` + else redditPostUrl += `✏%20${encodeURIComponent(exportObject.name)}` + redditPostUrl += "&text=" + + if (encodeURIComponent(redditPostJsonString).length > 7579 - redditPostUrl.length) { + redditPostJsonString = " " + miniJsonString } - exportDirectPostButton.href = directPostUrl + + redditPostUrl += encodeURIComponent(redditPostJsonString) + if (encodeURIComponent(redditPostUrl).length > 7579) { + // redditPostButton.classList.add("disabled") + // redditPostButton.ariaDisabled = true + redditPostButton.dataset.bsToggle = "tooltip" + redditPostButton.dataset.bsTitle = "This may not work due to the length of the entry. If needed, please copy manually." + if (!redditPostTooltip) redditPostTooltip = new bootstrap.Tooltip(redditPostButton) + } else { + // redditPostButton.classList.remove("disabled") + // redditPostButton.ariaDisabled = false + redditPostButton.dataset.bsTitle = "" + } + redditPostButton.href = redditPostUrl if (exportObject.id === 0) document.getElementById("redditFlair").textContent = "New Entry" else document.getElementById("redditFlair").textContent = "Edit Entry" + // GitHub + + let githubPostJsonString = prettyJsonString + let githubPostUrl = `${instanceRepo}/new/cleanup/data/patches?filename=gh-${[...Array(4)].map(() => Math.floor(Math.random() * 16).toString(16)).join('')}-${slugify(exportObject.name)}.json&value=` + + if (encodeURIComponent(githubPostJsonString).length > 8192 - githubPostUrl.length) { + githubPostJsonString = miniJsonString + } + + githubPostUrl += encodeURIComponent(githubPostJsonString) + if (githubPostUrl.length > 8192) { + // githubPostButton.classList.add("disabled") + // githubPostButton.ariaDisabled = true + githubPostButton.dataset.bsToggle = "tooltip" + githubPostButton.dataset.bsTitle = "This may not work due to the length of the entry. If needed, please copy manually." + if (!githubPostTooltip) githubPostTooltip = new bootstrap.Tooltip(githubPostButton) + } else { + // githubPostButton.classList.remove("disabled") + // githubPostButton.ariaDisabled = false + githubPostButton.dataset.bsTitle = "" + } + githubPostButton.href = githubPostUrl + + console.log(githubPostUrl) + exportModal.show() } diff --git a/web/index.html b/web/index.html index fd2c9c11..162bef70 100644 --- a/web/index.html +++ b/web/index.html @@ -347,13 +347,17 @@

If you want to use Reddit, use the Post Direct to Reddit button or manually copy the text below and submit it as a new text post to r/placeAtlas2 on Reddit. Don't forget to flair it with the New Entry flair.

-

If you want to use GitHub, read the contributing guide to submit a patch.

+

+ If you want to use GitHub, use the Submit Direct to GitHub button, or read the contributing guide to submit a patch. +

We will then check it and add it to the Atlas.