-
Notifications
You must be signed in to change notification settings - Fork 2
/
index.html
53 lines (50 loc) · 2.06 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<style>
body, form {
margin: 0;
padding: 0;
font-family: sans-serif;
}
form {
display: flex;
flex-direction: column;
height: 100vh;
justify-content: center;
align-items: center;
}
#origin {
margin: 50px 0;
width: 100%;
max-width: 800px;
font-size: 50px;
line-height: 1.3em;
text-align: center;
}
p {
max-width: 500px;
}
</style>
<form id="form">
<h1>Launch directly into your own customized CrUX Dashboard</h1>
<p><label for="origin">Submit a valid origin…</label></p>
<input id="origin" type="url" placeholder="https://developer.chrome.com" required>
<p><strong>What is a valid origin?</strong> <code>https://www.example.com</code>. Protocol (http or https), optional subdomain (www), and domain (example.com). No trailing slash (/) or file path (/rviscomi/crux-dash-launcher).</p>
<p><strong>Does it work for all websites?</strong> No. The CrUX dataset tracks about 6 million popular websites monthly. If your website isn't popular enough, it won't be in the dataset. Don't ask how popular is popular enough, we won't say.</p>
<p>Also try the <a href="https://dev.to/rick_viscomi/making-a-custom-crux-dash-shortcut-in-chrome-3i4e">custom <code>cruxdash</code> shortcut in Chrome</a> to launch directy into your own custom dashboard from the URL bar.</p>
<p>View the source on <a href="https://github.com/rviscomi/crux-dash-launcher">GitHub</a>. Made by <a href="https://twitter.com/rick_viscomi">@rick_viscomi</a>.</p>
</form>
<script>
var form = document.getElementById('form');
var origin = document.getElementById('origin');
form.addEventListener('submit', function(e) {
e.preventDefault();
var url = new URL(origin.value);
var encoded_origin = encodeURIComponent(url.origin);
var url = 'https://datastudio.google.com/reporting/bbc5698d-57bb-4969-9e07-68810b9fa348/page/keDQB?params=%7B%22origin%22:%22' + encoded_origin + '%22%7D';
window.location = url;
});
var url = new URL(window.location);
var search = url.searchParams.get('origin');
if (search) {
origin.value = search;
}
</script>