Skip to content

Commit 8900f60

Browse files
pauldambrapauldambra
committed
add husky and run prettier
1 parent f5d1898 commit 8900f60

File tree

8 files changed

+176065
-129752
lines changed

8 files changed

+176065
-129752
lines changed

‎.yarn/releases/yarn-1.23.0-20220130.1630.cjs‎

Lines changed: 175613 additions & 129420 deletions
Large diffs are not rendered by default.

‎README.md‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,4 +3,3 @@
33
## rrweb new release guide
44

55
Add rrweb-player version number to bottom of `src/versions.json`.
6-

‎index.html‎

Lines changed: 331 additions & 232 deletions
Large diffs are not rendered by default.

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,4 +26,4 @@
2626
"yarn": ">=1.23.0-20220130.1630"
2727
},
2828
"packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"
29-
}
29+
}

‎play/index.html‎

Lines changed: 95 additions & 79 deletions
Original file line numberDiff line numberDiff line change
@@ -1,98 +1,114 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>RRWeb Debug</title>
8+
<link
9+
href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css"
10+
rel="stylesheet"
11+
integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x"
12+
crossorigin="anonymous"
13+
/>
14+
<script type="module" src="/src/play.js"></script>
15+
<style>
16+
/* Minimal custom CSS - just for layout heights */
17+
html,
18+
body {
19+
height: 100%;
20+
}
321

4-
<head>
5-
<meta charset="UTF-8" />
6-
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
7-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
8-
<title>RRWeb Debug</title>
9-
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet"
10-
integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous" />
11-
<script type="module" src="/src/play.js"></script>
12-
<style>
13-
/* Minimal custom CSS - just for layout heights */
14-
html,
15-
body {
16-
height: 100%;
17-
}
22+
.main-content {
23+
height: calc(100vh - 100px);
24+
}
1825

19-
.main-content {
20-
height: calc(100vh - 100px);
21-
}
26+
/* Ensure JSON editor doesn't push player off screen */
27+
#jsoneditor {
28+
max-height: 70vh;
29+
overflow-y: auto;
30+
}
2231

23-
/* Ensure JSON editor doesn't push player off screen */
24-
#jsoneditor {
25-
max-height: 70vh;
26-
overflow-y: auto;
27-
}
32+
/* Ensure player takes available space properly */
33+
#player {
34+
min-height: 400px;
35+
}
36+
</style>
37+
</head>
2838

29-
/* Ensure player takes available space properly */
30-
#player {
31-
min-height: 400px;
32-
}
33-
</style>
34-
</head>
35-
36-
<body class="d-flex flex-column">
37-
<!-- Header Navbar -->
38-
<nav class="navbar navbar-dark bg-dark py-3">
39-
<div class="container-fluid">
40-
<div class="row w-100 align-items-center">
41-
<div class="col-lg-8">
42-
<a href="../" class="navbar-brand mb-0 fw-bold text-decoration-none">RRWeb Debug Player</a>
43-
<small class="text-muted d-block">
44-
Events: <span id="json-source" class="text-info">loading...</span>
45-
</small>
46-
</div>
47-
<div class="col-lg-4 text-end">
48-
<div class="d-flex align-items-center justify-content-end">
49-
<label for="versions" class="form-label text-light me-2 mb-0">Version:</label>
50-
<select id="versions" class="form-select form-select-sm" style="width: auto;"></select>
39+
<body class="d-flex flex-column">
40+
<!-- Header Navbar -->
41+
<nav class="navbar navbar-dark bg-dark py-3">
42+
<div class="container-fluid">
43+
<div class="row w-100 align-items-center">
44+
<div class="col-lg-8">
45+
<a href="../" class="navbar-brand mb-0 fw-bold text-decoration-none"
46+
>RRWeb Debug Player</a
47+
>
48+
<small class="text-muted d-block">
49+
Events: <span id="json-source" class="text-info">loading...</span>
50+
</small>
51+
</div>
52+
<div class="col-lg-4 text-end">
53+
<div class="d-flex align-items-center justify-content-end">
54+
<label for="versions" class="form-label text-light me-2 mb-0"
55+
>Version:</label
56+
>
57+
<select
58+
id="versions"
59+
class="form-select form-select-sm"
60+
style="width: auto"
61+
></select>
62+
</div>
5163
</div>
5264
</div>
5365
</div>
54-
</div>
55-
</nav>
66+
</nav>
5667

57-
<!-- Main Content -->
58-
<div class="container-fluid flex-grow-1 py-3 main-content">
59-
<div class="row h-100 g-3">
60-
<!-- Player Panel -->
61-
<div class="col-lg-9">
62-
<div class="card h-100 shadow-sm">
63-
<div class="card-header bg-light">
64-
<h5 class="card-title mb-0">
65-
<i class="bi bi-play-circle me-2"></i>Player
66-
</h5>
67-
</div>
68-
<div class="card-body p-0 position-relative bg-light">
69-
<div id="player" class="h-100 d-flex align-items-center justify-content-center">
70-
<div class="loading text-muted">
71-
<div class="spinner-border spinner-border-sm me-2" role="status">
72-
<span class="visually-hidden">Loading...</span>
68+
<!-- Main Content -->
69+
<div class="container-fluid flex-grow-1 py-3 main-content">
70+
<div class="row h-100 g-3">
71+
<!-- Player Panel -->
72+
<div class="col-lg-9">
73+
<div class="card h-100 shadow-sm">
74+
<div class="card-header bg-light">
75+
<h5 class="card-title mb-0">
76+
<i class="bi bi-play-circle me-2"></i>Player
77+
</h5>
78+
</div>
79+
<div class="card-body p-0 position-relative bg-light">
80+
<div
81+
id="player"
82+
class="h-100 d-flex align-items-center justify-content-center"
83+
>
84+
<div class="loading text-muted">
85+
<div
86+
class="spinner-border spinner-border-sm me-2"
87+
role="status"
88+
>
89+
<span class="visually-hidden">Loading...</span>
90+
</div>
91+
Loading player...
7392
</div>
74-
Loading player...
7593
</div>
7694
</div>
7795
</div>
7896
</div>
79-
</div>
8097

81-
<!-- JSON Editor Panel -->
82-
<div class="col-lg-3">
83-
<div class="card h-100 shadow-sm">
84-
<div class="card-header bg-light">
85-
<h5 class="card-title mb-0">
86-
<i class="bi bi-code-square me-2"></i>Events JSON
87-
</h5>
88-
</div>
89-
<div class="card-body p-0">
90-
<div id="jsoneditor" class="h-100"></div>
98+
<!-- JSON Editor Panel -->
99+
<div class="col-lg-3">
100+
<div class="card h-100 shadow-sm">
101+
<div class="card-header bg-light">
102+
<h5 class="card-title mb-0">
103+
<i class="bi bi-code-square me-2"></i>Events JSON
104+
</h5>
105+
</div>
106+
<div class="card-body p-0">
107+
<div id="jsoneditor" class="h-100"></div>
108+
</div>
91109
</div>
92110
</div>
93111
</div>
94112
</div>
95-
</div>
96-
</body>
97-
98-
</html>
113+
</body>
114+
</html>

‎src/play.js‎

Lines changed: 21 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ function defaultVersion() {
1515
const defaultVersion = Object.entries(versionsJson).find(
1616
([version, { default: isDefault }]) => {
1717
if (isDefault) return true;
18-
}
18+
},
1919
);
2020
return defaultVersion?.[0];
2121
}
@@ -49,9 +49,9 @@ function setupVersionSelector(version) {
4949
// For local data, make sure we preserve the source parameter
5050
if (location.searchParams.get("source") === "local") {
5151
// Verify sessionStorage still has the data before reloading
52-
const storedEvents = sessionStorage.getItem('rrweb-events');
52+
const storedEvents = sessionStorage.getItem("rrweb-events");
5353
if (!storedEvents) {
54-
alert('Local data was lost. Please go back and reload your events.');
54+
alert("Local data was lost. Please go back and reload your events.");
5555
return;
5656
}
5757
}
@@ -92,7 +92,7 @@ function showJSON(json) {
9292
content: { json },
9393
mode: "view",
9494
mainMenuBar: false,
95-
navigationBar: false
95+
navigationBar: false,
9696
},
9797
});
9898
window.events = json;
@@ -114,7 +114,7 @@ async function startPlayer() {
114114
const source = location.searchParams.get("source");
115115
let version = location.searchParams.get("version");
116116

117-
console.log('Starting player with:', { url, source, version });
117+
console.log("Starting player with:", { url, source, version });
118118

119119
if (!allowedVersion(version)) version = defaultVersion();
120120
const type = versionsJson[version].type;
@@ -123,23 +123,28 @@ async function startPlayer() {
123123
const useVirtualDom = Boolean(location.searchParams.get("virtual-dom"));
124124
let events;
125125

126-
if (source === 'local') {
126+
if (source === "local") {
127127
// Load events from sessionStorage
128128
try {
129-
const storedEvents = sessionStorage.getItem('rrweb-events');
130-
console.log('SessionStorage data found:', !!storedEvents);
129+
const storedEvents = sessionStorage.getItem("rrweb-events");
130+
console.log("SessionStorage data found:", !!storedEvents);
131131

132132
if (!storedEvents) {
133-
alert('No events data found. Please go back and select your events.');
133+
alert("No events data found. Please go back and select your events.");
134134
return;
135135
}
136136
events = JSON.parse(storedEvents);
137-
console.log('Loaded events from sessionStorage:', events.length, 'events');
137+
console.log(
138+
"Loaded events from sessionStorage:",
139+
events.length,
140+
"events",
141+
);
138142

139143
// Update the JSON source display to show it's local data
140-
document.getElementById("json-source").innerText = "Local data (file upload or paste)";
144+
document.getElementById("json-source").innerText =
145+
"Local data (file upload or paste)";
141146
} catch (error) {
142-
console.error('Error loading from sessionStorage:', error);
147+
console.error("Error loading from sessionStorage:", error);
143148
alert("Error loading local events data: " + error.message);
144149
return;
145150
}
@@ -150,7 +155,7 @@ async function startPlayer() {
150155
if (gistId) {
151156
try {
152157
const gistApiRequest = await fetch(
153-
`https://api.github.com/gists/${gistId}`
158+
`https://api.github.com/gists/${gistId}`,
154159
);
155160
const apiResponse = await gistApiRequest.json();
156161
const files = Object.values(apiResponse.files);
@@ -167,7 +172,7 @@ async function startPlayer() {
167172
} else if (jsonBlobId) {
168173
try {
169174
const jsonBlobApiRequest = await fetch(
170-
`https://jsonblob.com/api/v1/get/${jsonBlobId}`
175+
`https://jsonblob.com/api/v1/get/${jsonBlobId}`,
171176
);
172177
events = await jsonBlobApiRequest.json();
173178
} catch (error) {
@@ -208,8 +213,8 @@ async function startPlayer() {
208213
document.head.appendChild(scriptEl);
209214
}
210215

211-
if (document.readyState === 'loading') {
212-
document.addEventListener('DOMContentLoaded', startPlayer);
216+
if (document.readyState === "loading") {
217+
document.addEventListener("DOMContentLoaded", startPlayer);
213218
} else {
214219
startPlayer();
215220
}

‎src/populate-versions.ts‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,9 @@ export function populateVersions(selectedVersion?: string) {
55
const { rrwebVersion } = config;
66
const isDefault = "default" in config && config.default;
77

8-
return `<option value="${version}" ${isDefault ? "selected" : ""
9-
}>${version} (rrweb v${rrwebVersion})</option>`;
8+
return `<option value="${version}" ${
9+
isDefault ? "selected" : ""
10+
}>${version} (rrweb v${rrwebVersion})</option>`;
1011
})
1112
.join("");
1213

‎src/versions.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -120,4 +120,4 @@
120120
"type": "cjs",
121121
"default": true
122122
}
123-
}
123+
}

0 commit comments

Comments
 (0)