@zjy4fun/json-open 0.3.3 → 0.3.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.html +11 -17
- package/package.json +1 -1
package/index.html
CHANGED
|
@@ -477,7 +477,6 @@
|
|
|
477
477
|
<div class="panel panel-left" id="panel-left">
|
|
478
478
|
<div class="panel-header">
|
|
479
479
|
<span class="label">Input</span>
|
|
480
|
-
<button id="btn-format" class="primary">✨ Format</button>
|
|
481
480
|
<button id="btn-copy">📋 Copy</button>
|
|
482
481
|
<button id="btn-share">🔗 Share</button>
|
|
483
482
|
</div>
|
|
@@ -511,8 +510,8 @@
|
|
|
511
510
|
<div class="viewer" id="viewer">
|
|
512
511
|
<div class="empty-state">
|
|
513
512
|
<div class="icon">{ }</div>
|
|
514
|
-
<div>Paste JSON on the left
|
|
515
|
-
<div style="font-size:12px">
|
|
513
|
+
<div>Paste or type JSON on the left</div>
|
|
514
|
+
<div style="font-size:12px">It will format automatically</div>
|
|
516
515
|
</div>
|
|
517
516
|
</div>
|
|
518
517
|
</div>
|
|
@@ -660,7 +659,6 @@
|
|
|
660
659
|
// ===== Elements =====
|
|
661
660
|
var jsonInput = document.getElementById('json-input')
|
|
662
661
|
var viewer = document.getElementById('viewer')
|
|
663
|
-
var btnFormat = document.getElementById('btn-format')
|
|
664
662
|
var btnCopy = document.getElementById('btn-copy')
|
|
665
663
|
var btnShare = document.getElementById('btn-share')
|
|
666
664
|
var btnExpandAll = document.getElementById('expand-all')
|
|
@@ -683,7 +681,7 @@
|
|
|
683
681
|
function doFormat() {
|
|
684
682
|
var input = jsonInput.value.trim()
|
|
685
683
|
if (!input) {
|
|
686
|
-
viewer.innerHTML = '<div class="empty-state"><div class="icon">{ }</div><div>Paste JSON on the left
|
|
684
|
+
viewer.innerHTML = '<div class="empty-state"><div class="icon">{ }</div><div>Paste or type JSON on the left</div><div style="font-size:12px">It will format automatically</div></div>'
|
|
687
685
|
statusInfo.textContent = 'Ready'
|
|
688
686
|
statusSize.textContent = ''
|
|
689
687
|
toggleWrap.classList.add('hidden')
|
|
@@ -729,8 +727,6 @@
|
|
|
729
727
|
}
|
|
730
728
|
|
|
731
729
|
// ===== Buttons =====
|
|
732
|
-
btnFormat.addEventListener('click', doFormat)
|
|
733
|
-
|
|
734
730
|
btnCopy.addEventListener('click', function () {
|
|
735
731
|
var text = jsonInput.value.trim()
|
|
736
732
|
if (!text) return
|
|
@@ -768,12 +764,8 @@
|
|
|
768
764
|
})
|
|
769
765
|
})
|
|
770
766
|
|
|
771
|
-
//
|
|
767
|
+
// Input behavior
|
|
772
768
|
jsonInput.addEventListener('keydown', function (e) {
|
|
773
|
-
if ((e.ctrlKey || e.metaKey) && e.key === 'Enter') {
|
|
774
|
-
e.preventDefault()
|
|
775
|
-
doFormat()
|
|
776
|
-
}
|
|
777
769
|
// Tab support
|
|
778
770
|
if (e.key === 'Tab') {
|
|
779
771
|
e.preventDefault()
|
|
@@ -975,11 +967,13 @@
|
|
|
975
967
|
}
|
|
976
968
|
})
|
|
977
969
|
|
|
978
|
-
// =====
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
970
|
+
// ===== Auto format on input =====
|
|
971
|
+
var inputDebounceTimer
|
|
972
|
+
jsonInput.addEventListener('input', function () {
|
|
973
|
+
clearTimeout(inputDebounceTimer)
|
|
974
|
+
inputDebounceTimer = setTimeout(function () {
|
|
975
|
+
doFormat()
|
|
976
|
+
}, 200)
|
|
983
977
|
})
|
|
984
978
|
|
|
985
979
|
// ===== Load from URL hash =====
|