Skip to content

Commit aedb9f1

Browse files
asthabh23asthabh23
authored
Merge pull request #756 from adobe/facets-help
feat: Help for facets
2 parents e1e9b44 + 1d491f8 commit aedb9f1

File tree

9 files changed

+231
-121
lines changed

9 files changed

+231
-121
lines changed

‎tools/oversight/elements/list-facet.js

+3
Original file line numberDiff line numberDiff line change
@@ -131,6 +131,7 @@ export default class ListFacet extends HTMLElement {
131131
const fieldSet = this.querySelector('fieldset') || document.createElement('fieldset');
132132
fieldSet.classList.add(`facet-${facetName}`);
133133
const legendText = this.querySelector('legend')?.textContent || facetName;
134+
const extraElements = Array.from(this.querySelectorAll(':scope > a, legend > a.icon') || []);
134135

135136
fieldSet.textContent = '';
136137

@@ -165,6 +166,8 @@ export default class ListFacet extends HTMLElement {
165166
});
166167

167168
legend.append(clipboard, clipboardPaste);
169+
extraElements.forEach((el) => el.classList.add('icon'));
170+
legend.append(...extraElements);
168171
if (drilldownAtt && url.searchParams.get('drilldown') !== facetName) {
169172
const drilldown = document.createElement('a');
170173
drilldown.className = 'drilldown';

‎tools/oversight/explorer.html

+20-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
<html>
2-
32
<head>
43
<title>Real Use Monitoring (RUM) Explorer | AEM Live</title>
54
<script type="importmap">{"imports": {
@@ -125,6 +124,8 @@ <h2>TTFB</h2>
125124
</list-facet>
126125
<list-facet facet="userAgent" drilldown="share.html">
127126
<legend>Device Type and Operating System</legend>
127+
<a href="/docs/rum-explorer#device-share" class="help"
128+
target="_blank" title="What devices and operating systems have accessed your site?"></a>
128129
<dl>
129130
<dt>desktop</dt>
130131
<dd>All Desktop</dd>
@@ -158,9 +159,13 @@ <h2>TTFB</h2>
158159
</list-facet>
159160
<link-facet facet="url" drilldown="list.html" thumbnail="true" highlight="filter">
160161
<legend>URL</legend>
162+
<a href="/docs/rum-explorer#url" class="help"
163+
target="_blank" title="What different pages make up your site?"></a>
161164
</link-facet>
162165
<list-facet facet="checkpoint" drilldown="flow.html" highlight="filter">
163166
<legend>Checkpoints</legend>
167+
<a href="/docs/rum-explorer#checkpoints" class="help"
168+
target="_blank" title="What type of activity data is collected?"></a>
164169
<dl>
165170
<dt>enter</dt>
166171
<dd>Visit Entry</dd>
@@ -190,28 +195,42 @@ <h2>TTFB</h2>
190195
</list-facet>
191196
<literal-facet facet="click.source" drilldown="list.html">
192197
<legend>Click Source (CSS Selector)</legend>
198+
<a href="/docs/rum-explorer#facet-click" class="help"
199+
target="_blank" title="What page visitors clicked"></a>
193200
</literal-facet>
194201
<link-facet facet="click.target" drilldown="list.html">
195202
<legend>Click Target (URL)</legend>
203+
<a href="/docs/rum-explorer#facet-click" class="help"
204+
target="_blank" title="What page visitors clicked"></a>
196205
</link-facet>
197206
<literal-facet facet="viewmedia.source" drilldown="list.html">
198207
<legend>Media Source (CSS Selector)</legend>
208+
<a href="/docs/rum-explorer#facet-viewmedia" class="help"
209+
target="_blank" title="What image/video visitors have seen?"></a>
199210
</literal-facet>
200211
<thumbnail-facet facet="viewmedia.target" drilldown="list.html">
201212
<legend>Media Target</legend>
213+
<a href="/docs/rum-explorer#facet-viewmedia" class="help"
214+
target="_blank" title="What image/video visitors have seen?"></a>
202215
</thumbnail-facet>
203216
<literal-facet facet="viewblock.source" drilldown="list.html">
204217
<legend>Block (CSS Selector)</legend>
218+
<a href="/docs/rum-explorer#facet-viewblock" class="help"
219+
target="_blank" title="What blocks visitors have seen?"></a>
205220
</literal-facet>
206221
<link-facet facet="enter.source" drilldown="list.html" thumbnail="true" favicon="true">
207222
<legend>External Referrer</legend>
223+
<a href="/docs/rum-explorer#facet-enter" class="help"
224+
target="_blank" title="How the users entered into the site?"></a>
208225
<dl>
209226
<dt>(direct)</dt>
210227
<dd>Direct Entry (or via App)</dd>
211228
</dl>
212229
</link-facet>
213230
<link-facet facet="navigate.source" thumbnail="true" drilldown="list.html">
214231
<legend>Internal Referrer</legend>
232+
<a href="/docs/rum-explorer#facet-navigate" class="help"
233+
target="_blank" title="Internal navigation paths on the site"></a>
215234
</link-facet>
216235

217236
<list-facet facet="consent.source">

‎tools/oversight/flow.html

+10
Original file line numberDiff line numberDiff line change
@@ -114,6 +114,8 @@ <h2>TTFB</h2>
114114
<facet-sidebar>
115115
<list-facet facet="userAgent" drilldown="share.html">
116116
<legend>Device Type and Operating System</legend>
117+
<a href="/docs/rum-explorer#device-share" class="help"
118+
target="_blank" title="What devices and operating systems have accessed your site?"></a>
117119
<dl>
118120
<dt>desktop</dt>
119121
<dd>All Desktop</dd>
@@ -147,9 +149,13 @@ <h2>TTFB</h2>
147149
</list-facet>
148150
<link-facet facet="url" drilldown="list.html" thumbnail="true" highlight="filter">
149151
<legend>URL</legend>
152+
<a href="/docs/rum-explorer#url" class="help"
153+
target="_blank" title="What different pages make up your site?"></a>
150154
</link-facet>
151155
<list-facet facet="checkpoint" drilldown="flow.html" highlight="filter">
152156
<legend>Checkpoints</legend>
157+
<a href="/docs/rum-explorer#checkpoints" class="help"
158+
target="_blank" title="What type of activity data is collected?"></a>
153159
<dl>
154160
<dt>enter</dt>
155161
<dd>Visit Entry</dd>
@@ -196,6 +202,8 @@ <h2>TTFB</h2>
196202
</list-facet>
197203
<list-facet facet="clicktarget">
198204
<legend>Click Target Type</legend>
205+
<a href="/docs/rum-explorer#facet-click" class="help"
206+
target="_blank" title="Where on the page (including links) visitors clicked?"></a>
199207
</list-facet>
200208
<list-facet facet="exit">
201209
<legend>Exit Link</legend>
@@ -205,6 +213,8 @@ <h2>TTFB</h2>
205213
</vitals-facet>
206214
<thumbnail-facet facet="lcp.target">
207215
<legend>LCP Image</legend>
216+
<a href="/docs/rum-explorer#facet-lcp" class="help"
217+
target="_blank" title="Identify elements of page that are slowing down page loading"></a>
208218
</thunbnail-facet>
209219
<literal-facet facet="lcp.source">
210220
<legend>LCP Element</legend>

‎tools/oversight/list.html

+20
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,8 @@ <h2>TTFB</h2>
109109
<facet-sidebar>
110110
<list-facet facet="userAgent" drilldown="share.html">
111111
<legend>Device Type and Operating System</legend>
112+
<a href="/docs/rum-explorer#device-share" class="help"
113+
target="_blank" title="What devices and operating systems have accessed your site?"></a>
112114
<dl>
113115
<dt>desktop</dt>
114116
<dd>All Desktop</dd>
@@ -142,9 +144,13 @@ <h2>TTFB</h2>
142144
</list-facet>
143145
<link-facet facet="url" drilldown="list.html" thumbnail="true" highlight="filter">
144146
<legend>URL</legend>
147+
<a href="/docs/rum-explorer#url" class="help"
148+
target="_blank" title="What different pages make up your site?"></a>
145149
</link-facet>
146150
<list-facet facet="checkpoint" drilldown="flow.html" highlight="filter">
147151
<legend>Checkpoints</legend>
152+
<a href="/docs/rum-explorer#checkpoints" class="help"
153+
target="_blank" title="What type of activity data is collected?"></a>
148154
<dl>
149155
<dt>enter</dt>
150156
<dd>Visit Entry</dd>
@@ -170,28 +176,42 @@ <h2>TTFB</h2>
170176
</list-facet>
171177
<literal-facet facet="click.source" drilldown="list.html">
172178
<legend>Click Source (CSS Selector)</legend>
179+
<a href="/docs/rum-explorer#facet-click" class="help"
180+
target="_blank" title="What page visitors clicked"></a>
173181
</literal-facet>
174182
<link-facet facet="click.target" drilldown="list.html">
175183
<legend>Click Target (URL)</legend>
184+
<a href="/docs/rum-explorer#facet-click" class="help"
185+
target="_blank" title="What page visitors clicked"></a>
176186
</link-facet>
177187
<literal-facet facet="viewmedia.source" drilldown="list.html">
178188
<legend>Media Source (CSS Selector)</legend>
189+
<a href="/docs/rum-explorer#facet-viewmedia" class="help"
190+
target="_blank" title="What image/video visitors have seen?"></a>
179191
</literal-facet>
180192
<thumbnail-facet facet="viewmedia.target" drilldown="list.html">
181193
<legend>Media Target</legend>
194+
<a href="/docs/rum-explorer#facet-viewmedia" class="help"
195+
target="_blank" title="What image/video visitors have seen?"></a>
182196
</thumbnail-facet>
183197
<literal-facet facet="viewblock.source" drilldown="list.html">
184198
<legend>Block (CSS Selector)</legend>
199+
<a href="/docs/rum-explorer#facet-viewblock" class="help"
200+
target="_blank" title="What blocks visitors have seen?"></a>
185201
</literal-facet>
186202
<link-facet facet="enter.source" drilldown="list.html" thumbnail="false">
187203
<legend>External Referrer</legend>
204+
<a href="/docs/rum-explorer#facet-enter" class="help"
205+
target="_blank" title="How the users entered into the site?"></a>
188206
<dl>
189207
<dt>(direct)</dt>
190208
<dd>Direct Entry (or via App)</dd>
191209
</dl>
192210
</link-facet>
193211
<link-facet facet="navigate.source" thumbnail="true" drilldown="list.html">
194212
<legend>Internal Referrer</legend>
213+
<a href="/docs/rum-explorer#facet-navigate" class="help"
214+
target="_blank" title="Internal navigation paths on the site"></a>
195215
</link-facet>
196216

197217
<list-facet facet="consent.source">

0 commit comments

Comments
 (0)