From 0c302ef52c196c82682f9bf7874fb39ff1d44f04 Mon Sep 17 00:00:00 2001
From: Dante Calderon <18385321+dantehemerson@users.noreply.github.com>
Date: Sat, 2 Mar 2024 17:44:58 -0500
Subject: [PATCH 1/2] Add support to import and export using url param
---
css/main.css | 7 +++++
index.html | 3 ++
js/main.js | 77 ++++++++++++++++++++++++++++++++++++++++++++++++++--
3 files changed, 84 insertions(+), 3 deletions(-)
diff --git a/css/main.css b/css/main.css
index 34fbb41..7ba11e9 100644
--- a/css/main.css
+++ b/css/main.css
@@ -142,6 +142,13 @@ h2 {
top: 3px;
}
+#share-btn {
+ display: inline-block;
+ position: relative;
+ top: -4px;
+ cursor: pointer;
+}
+
.left-panel {
width: 200px;
height: calc(100% - 48px);
diff --git a/index.html b/index.html
index ee72b6c..352d61c 100644
--- a/index.html
+++ b/index.html
@@ -30,6 +30,9 @@ Online JSON Compare
c-1.908-1.243-2.858-2.807-2.858-4.716l-4.853-130.47c0-2.667,0.953-4.665,2.856-5.996c2.474-2.093,4.758-3.14,6.854-3.14h62.809
c2.098,0,4.38,1.043,6.854,3.14c1.902,1.331,2.851,3.14,2.851,5.424L292.088,304.357z"/>
Invalid JSON
+
+
+
diff --git a/js/main.js b/js/main.js
index 45747bf..2125e46 100644
--- a/js/main.js
+++ b/js/main.js
@@ -118,9 +118,80 @@
return $('body').hasClass('lighttheme');
}
- BackboneEvents.mixin(JsonInputView.prototype);
+ const URL_LIMIT = 4000;
+
+ function encodeData(diff) {
+ try {
+ const encoded = encodeURIComponent(diff)
+ if (encoded.length > URL_LIMIT) {
+ throw new Error(`Encoded data is too long (${encoded.length} characters)`)
+ }
+ return encoded
+ } catch (error) {
+ throw new Error(error.message || `Failed to encode data`)
+ }
+ }
+
+ function decodeData(encodedParam) {
+ if (!encodedParam) return undefined;
+ try {
+ return decodeURIComponent(encodedParam)
+ } catch (error) {
+ throw new Error(error.message || `Failed to decode data`)
+ }
+ }
+
+ async function copyToClipboard(text) {
+ if (navigator.clipboard) {
+ await navigator.clipboard.writeText(text);
+ } else {
+ const el = document.createElement('textarea');
+ el.value = text;
+ document.body.appendChild(el);
+ el.select();
+ document.execCommand('copy');
+ document.body.removeChild(el);
+ }
+ }
+
+ document.querySelector('#share-btn').addEventListener('click', async () => {
+ try {
+ const currentDiff = getCurrentDiff();
+ const encoded = encodeData(currentDiff);
+ const url = `${window.location.origin}${window.location.pathname}?d=${encoded}`;
+ await copyToClipboard(url);
+ alert('URL copied to clipboard');
+ } catch (error) {
+ alert(error.message || 'Failed to copy URL to clipboard');
+ }
+ })
+
+
var currentDiff = localStorage.getItem('current-diff') && JSON.parse(localStorage.getItem('current-diff'));
+
+ // Load data from url if present
+ const urlData = new URLSearchParams(window.location.search).get("d");
+
+ if (urlData) {
+ try {
+ const decoded = decodeData(urlData);
+ const urlDiff = JSON.parse(decoded);
+
+ if (urlDiff && (urlDiff.left || urlDiff.right)) {
+ currentDiff = urlDiff;
+
+ saveDiff(JSON.stringify(currentDiff));
+ }
+ } catch(error) {
+ console.error('Failed to load data from URL', error);
+ } finally {
+ window.history.replaceState({}, document.title, window.origin);
+ }
+ }
+
+ BackboneEvents.mixin(JsonInputView.prototype);
+
var leftInputView = new JsonInputView(document.getElementById('json-diff-left'), currentDiff && currentDiff.left);
var rightInputView = new JsonInputView(document.getElementById('json-diff-right'), currentDiff && currentDiff.right);
leftInputView.on('change', onInputChange);
@@ -180,9 +251,9 @@
});
}
- function saveDiff() {
+ function saveDiff(diff) {
if (!localStorage.getItem('dont-save-diffs')) {
- var currentDiff = getCurrentDiff();
+ var currentDiff = diff || getCurrentDiff();
localStorage.setItem('current-diff', currentDiff);
}
}
From bf75226cc58bef7979a6168574df5c34ccbba792 Mon Sep 17 00:00:00 2001
From: Dante Calderon <18385321+dantehemerson@users.noreply.github.com>
Date: Sat, 2 Mar 2024 22:15:20 -0500
Subject: [PATCH 2/2] Remove path on rename
---
js/main.js | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/js/main.js b/js/main.js
index 2125e46..d7b5a94 100644
--- a/js/main.js
+++ b/js/main.js
@@ -158,7 +158,7 @@
try {
const currentDiff = getCurrentDiff();
const encoded = encodeData(currentDiff);
- const url = `${window.location.origin}${window.location.pathname}?d=${encoded}`;
+ const url = `${window.location.origin}?d=${encoded}`;
await copyToClipboard(url);
alert('URL copied to clipboard');
} catch (error) {