Skip to content

Commit 40d939a

Browse files
committed
Fix JSON pretty-print + wrapped formatting
1 parent 8e42800 commit 40d939a

3 files changed

Lines changed: 411 additions & 32 deletions

File tree

debug-db-base/src/main/assets/app.js

Lines changed: 154 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,11 @@ $( document ).ready(function() {
22
if (window.AddbUiCustomization && typeof window.AddbUiCustomization.init === "function") {
33
window.AddbUiCustomization.init();
44
}
5-
getDBList();
5+
if (shouldUseDemoData()) {
6+
initDemoMode();
7+
} else {
8+
getDBList();
9+
}
610
$("#query").keypress(function(e){
711
if(e.which == 13) {
812
queryFunction();
@@ -28,6 +32,150 @@ $( document ).ready(function() {
2832
});
2933

3034
var isDatabaseSelected = true;
35+
var isDemoModeEnabled = false;
36+
37+
function shouldUseDemoData() {
38+
try {
39+
var search = window.location.search || "";
40+
if (/(^|[?&])demo=1(&|$)/.test(search)) return true;
41+
return window.location.protocol === "file:";
42+
} catch (e) {
43+
return false;
44+
}
45+
}
46+
47+
function demoRepeat(str, count) {
48+
var out = "";
49+
for (var i = 0; i < count; i++) out += str;
50+
return out;
51+
}
52+
53+
function demoCell(value, dataType) {
54+
return { value: value, dataType: dataType };
55+
}
56+
57+
function buildDemoResult() {
58+
var longToken = "tok_" + demoRepeat("A", 72) + "." + demoRepeat("B", 72) + "." + demoRepeat("C", 72);
59+
var veryLongUrl =
60+
"https://example.com/" +
61+
demoRepeat("path/", 8) +
62+
"resource?query=" +
63+
demoRepeat("x", 48) +
64+
"&more=" +
65+
demoRepeat("y", 48);
66+
67+
var json1 = JSON.stringify({
68+
user: {
69+
id: 42,
70+
name: "Ada Lovelace",
71+
flags: { isAdmin: false, isTester: true, beta: true }
72+
},
73+
session: {
74+
token: longToken,
75+
expiresAt: "2025-12-14T12:34:56Z"
76+
},
77+
features: ["ui_customization", "json_tree", "sticky_header"]
78+
});
79+
80+
var json2 = JSON.stringify({
81+
request: {
82+
method: "POST",
83+
url: veryLongUrl,
84+
headers: {
85+
"content-type": "application/json",
86+
"x-request-id": "req_" + demoRepeat("7", 24)
87+
}
88+
},
89+
timingsMs: { dns: 12, tcp: 34, tls: 56, ttfb: 78, total: 234 },
90+
tags: ["android", "debug-db", "datatable"]
91+
});
92+
93+
var json3 = JSON.stringify([
94+
{ type: "event", ts: 1734150000, data: { name: "launch", coldStart: true } },
95+
{ type: "event", ts: 1734150030, data: { name: "tap", target: "settings_button" } },
96+
{ type: "event", ts: 1734150055, data: { name: "network", status: 200, bytes: 2048 } }
97+
]);
98+
99+
var json4 = JSON.stringify({
100+
emptyObject: {},
101+
emptyArray: [],
102+
nested: {
103+
level2: {
104+
level3: {
105+
message: "Expand/collapse should keep 2nd-level collapsed by default.",
106+
numbers: [1, 2, 3, 4, 5]
107+
}
108+
}
109+
}
110+
});
111+
112+
return {
113+
isSuccessful: true,
114+
isSelectQuery: true,
115+
isEditable: false,
116+
tableInfos: [
117+
{ title: "id", isPrimary: true },
118+
{ title: "name", isPrimary: false },
119+
{ title: "is_active", isPrimary: false },
120+
{ title: "json_payload", isPrimary: false },
121+
{ title: "notes", isPrimary: false }
122+
],
123+
rows: [
124+
[
125+
demoCell(1, "number"),
126+
demoCell("Alpha", "string"),
127+
demoCell(true, "boolean"),
128+
demoCell(json1, "string"),
129+
demoCell("Try JSON mode: Pretty-printed", "string")
130+
],
131+
[
132+
demoCell(2, "number"),
133+
demoCell("Beta", "string"),
134+
demoCell(false, "boolean"),
135+
demoCell(json2, "string"),
136+
demoCell("Includes a very long URL + token", "string")
137+
],
138+
[
139+
demoCell(3, "number"),
140+
demoCell("Gamma", "string"),
141+
demoCell(true, "boolean"),
142+
demoCell(json3, "string"),
143+
demoCell("Root JSON array (children collapsed at level 2)", "string")
144+
],
145+
[
146+
demoCell(4, "number"),
147+
demoCell("Delta", "string"),
148+
demoCell(true, "boolean"),
149+
demoCell(json4, "string"),
150+
demoCell("Has empty containers + deep nesting", "string")
151+
]
152+
]
153+
};
154+
}
155+
156+
function loadDemoData() {
157+
var result = buildDemoResult();
158+
inflateData(result);
159+
}
160+
161+
function initDemoMode() {
162+
isDemoModeEnabled = true;
163+
isDatabaseSelected = false;
164+
165+
$("#selected-db-info").text("Demo mode (local file) — showing sample data for UI testing");
166+
167+
$("#run-query").removeClass("active").addClass("disabled").prop("disabled", true);
168+
$("#selected-db-download").removeClass("active").addClass("disabled").prop("disabled", true);
169+
$("#selected-db-delete").removeClass("active").addClass("disabled").prop("disabled", true);
170+
171+
$("#db-list").empty().append("<a href='#' class='list-group-item selected'>DEMO_DB</a>");
172+
$("#table-list")
173+
.empty()
174+
.append("<a href='#table=demo_table' class='list-group-item selected' onClick='loadDemoData();'>demo_table</a>");
175+
176+
loadDemoData();
177+
showSuccessInfo("Loaded demo data (open Customize UI → Text & JSON to try Pretty-printed)");
178+
}
31179

32180
function getData(tableName) {
33181

@@ -44,6 +192,11 @@ function queryFunction() {
44192

45193
var query = $('#query').val();
46194

195+
if (isDemoModeEnabled) {
196+
showErrorInfo("Demo mode: database queries are not available (UI only)");
197+
return;
198+
}
199+
47200
$.ajax({url: "query?query="+escape(query), success: function(result){
48201

49202
result = JSON.parse(result);

debug-db-base/src/main/assets/custom.css

Lines changed: 65 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -106,15 +106,75 @@ body.addb-max-col-width #parent-data-div table.dataTable td {
106106

107107
body.addb-json-mode-wrapped #parent-data-div table.dataTable td.addb-json-cell {
108108
white-space: normal;
109-
overflow-wrap: anywhere;
110-
word-break: break-word;
109+
font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
110+
overflow-wrap: break-word;
111+
word-break: normal;
112+
vertical-align: top;
111113
}
112114

113115
body.addb-json-mode-pretty #parent-data-div table.dataTable td.addb-json-cell {
114-
white-space: pre-wrap;
116+
white-space: pre;
115117
font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
116-
overflow-wrap: anywhere;
117-
word-break: break-word;
118+
overflow-wrap: normal;
119+
word-break: normal;
120+
vertical-align: top;
121+
}
122+
123+
body.addb-max-col-width.addb-json-mode-pretty #parent-data-div table.dataTable td.addb-json-cell {
124+
white-space: pre-wrap;
125+
overflow-wrap: break-word;
126+
}
127+
128+
body.addb-json-mode-pretty #parent-data-div table.dataTable td.addb-json-cell .addb-json-tree {
129+
display: inline-block;
130+
}
131+
132+
#parent-data-div table.dataTable td.addb-json-cell .addb-json-line {
133+
display: block;
134+
margin: 0;
135+
}
136+
137+
#parent-data-div table.dataTable td.addb-json-cell .addb-json-gutter {
138+
display: inline-block;
139+
width: 14px;
140+
}
141+
142+
#parent-data-div table.dataTable td.addb-json-cell details.addb-json-node {
143+
margin: 0;
144+
padding: 0;
145+
}
146+
147+
#parent-data-div table.dataTable td.addb-json-cell details.addb-json-node > summary {
148+
cursor: pointer;
149+
list-style: none;
150+
}
151+
152+
#parent-data-div table.dataTable td.addb-json-cell details.addb-json-node > summary::-webkit-details-marker {
153+
display: none;
154+
}
155+
156+
#parent-data-div table.dataTable td.addb-json-cell details.addb-json-node > summary::marker {
157+
content: "";
158+
}
159+
160+
#parent-data-div table.dataTable td.addb-json-cell details.addb-json-node > summary .addb-json-gutter::before {
161+
content: "▸";
162+
}
163+
164+
#parent-data-div table.dataTable td.addb-json-cell details.addb-json-node[open] > summary .addb-json-gutter::before {
165+
content: "▾";
166+
}
167+
168+
#parent-data-div table.dataTable td.addb-json-cell details.addb-json-node > summary .addb-json-summary-open {
169+
display: none;
170+
}
171+
172+
#parent-data-div table.dataTable td.addb-json-cell details.addb-json-node[open] > summary .addb-json-summary-open {
173+
display: inline;
174+
}
175+
176+
#parent-data-div table.dataTable td.addb-json-cell details.addb-json-node[open] > summary .addb-json-summary-closed {
177+
display: none;
118178
}
119179

120180
#snackbar {

0 commit comments

Comments
 (0)