Improve naming things

This commit is contained in:
Folyd 2020-05-30 00:14:27 +08:00
parent 185b7fa25e
commit c7d80d4bf5
5 changed files with 30 additions and 30 deletions

View file

@ -53,7 +53,7 @@
<small class="offline-doc-message"></small>
</div>
<div style="margin-top: 10px">
<label for="crate-registry">Crate registry</label>
<label>Crate registry</label>
<select name="crate-registry">
<option value="crates.io">crates.io</option>
<option value="lib.rs">lib.rs</option>
@ -61,7 +61,7 @@
</div>
<div class="statistics-page">
<a href="../stats/index.html" target="_blank" class="stats-link">
<b id="stats-week-count">0</b> searchings in the last week >
<b id="stats-week-count">0</b> searches in the last week >
</a>
</div>
<div style="margin-top: 30px; font-size: 11px;text-align: center">

View file

@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Rust Search Extension Redirect</title>
<title>Redirect - Rust Search Extension</title>
<script src="redirect.js"></script>
<link href="https://fonts.googleapis.com/css?family=Alfa+Slab+One&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Fira+Sans:400,500,600&display=swap" rel="stylesheet">
@ -28,10 +28,10 @@
<div style="margin: 30px auto; padding: 30px 80px; background-color: white;">
<div class="logo flex-layout" style="width: 920px;">
<img src="../icon.png" alt="rust-search-extension-logo">
Rust Searching Extension
Rust Search Extension
</div>
<div class="loading">
Get crate's repository url via crates api...
Get crate's repository url via crates.io api...
</div>
</div>
</div>

View file

@ -9,7 +9,7 @@ h3 {
.show:not(:first-child) {
border-left: 1px solid #ffffff;
}
.searching-stats-graph {
.search-stats-graph {
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
border-bottom-left-radius: 3px;
@ -29,12 +29,12 @@ h3 {
height: 8px;
border-radius: 50%;
}
.searching-stats-text li {
.search-stats-text li {
display: flex;
align-items: center;
list-style: none;
}
.searching-stats-text span {
.search-stats-text span {
padding: 3px;
font-size: 16px;
}

View file

@ -4,7 +4,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Rust Search Extension Statistics</title>
<title>Rust Search Statistics</title>
<script type="text/javascript" src="../libs/calendar-heatmap.js"></script>
<script type="text/javascript" src="../libs/d3.min.js"></script>
<script type="text/javascript" src="../libs/moment.min.js"></script>
@ -23,21 +23,20 @@
<div style="margin: 30px auto; padding: 30px 80px; background-color: white;">
<div class="logo flex-layout">
<img src="../icon.png" alt="rust-search-extension-logo">
Rust Searching Statistics
Rust Search Statistics
</div>
<div style="flex-direction: column;" class="flex-layout">
<div class="chart-heatmap"></div>
</div>
<div class="searching-time" style="text-align: center;font-size: 20px;">
<b>0</b> searchings in total since the first day, approximately saved <b>0 seconds.</b>
<a href="#appendix1"><small>[1]</small></a>
<div class="search-time" style="text-align: center;font-size: 20px;">
<b>0</b> searches in total since the first day, approximately saved <b>0 seconds.</b>
</div>
<div id="chart">
<div style="padding: 30px 0;">
<div class="searching-stats-graph" style=" height: 8px; width: 100%; display: flex;">
<div class="search-stats-graph" style=" height: 8px; width: 100%; display: flex;">
</div>
<div class="searching-stats-text" style=" padding: 10px;">
<div class="search-stats-text" style=" padding: 10px;">
<ol style="display: flex; justify-content: space-around;">
</ol>
</div>
@ -45,21 +44,21 @@
<div style="display: flex; flex-direction: row-reverse; align-items: flex-start; padding: 30px 0;">
<div>
<div class="" style="padding-bottom: 20px;">
<h3>Searchings per weekday</h3>
<h3>Searches per weekday</h3>
<div class="chart-histogram-week" style="position: relative;"></div>
</div>
<div class="" style="padding-bottom: 20px;">
<h3>Searchings per day of month</h3>
<h3>Searches per day of month</h3>
<div class="chart-histogram-date" style="position: relative;"></div>
</div>
<div class="" style="padding-bottom: 20px;">
<h3>Searchings per hour (local time)</h3>
<h3>Searches per hour (local time)</h3>
<div class="chart-histogram-hour" style="position: relative;"></div>
</div>
</div>
<div class="" style="padding-right: 80px;">
<h3>Top searching crates</h3>
<h3>Top searched crates</h3>
<div class="topCratesData" style="position: relative;box-sizing: border-box;">
</div>
</div>
@ -67,7 +66,7 @@
</div>
<hr>
<div class="appendix">
<div id="appendix1"><small>1. We consider one searching save 5 seconds in average, just an estimated value.</small></div>
<div id="appendix1"><small>1. We consider one search save 5 seconds in average, just an estimated value.</small></div>
</div>
</div>
</div>

View file

@ -40,7 +40,7 @@ history.forEach(({ query, content, description, time }) => {
if (stat) {
stat.value += 1;
} else {
// Classify the default searching
// Classify the default search cases
if (["https://crates.io", "https://lib.rs"].some(prefix => content.startsWith(prefix))) {
// Crates
stats[2].value += 1;
@ -73,6 +73,7 @@ history.forEach(({ query, content, description, time }) => {
topCratesData[crate] = counter + 1;
}
} else if (["chrome-extension", "moz-extension"].some(prefix => content.startsWith(prefix))) {
// This is the repository redirection case
let url = new URL(content);
let search = url.search.replace("?crate=", "");
let crate = search.replace(/-/gi, "_");
@ -97,9 +98,9 @@ let heatmap = calendarHeatmap()
{ min: 12, max: 'Infinity', color: '#f40703' }
])
.tooltipUnit([
{ min: 0, unit: 'searching' },
{ min: 1, max: 1, unit: 'searching' },
{ min: 2, max: 'Infinity', unit: 'searchings' }
{ min: 0, unit: 'search' },
{ min: 1, max: 1, unit: 'searches' },
{ min: 2, max: 'Infinity', unit: 'searches' }
])
.legendEnabled(true)
.onClick(function (data) {
@ -131,8 +132,8 @@ histogram({
...histogramConfig,
});
let searchingTimes = document.querySelector(".searching-time");
let frequency = searchingTimes.querySelectorAll("b");
let searchTimes = document.querySelector(".search-time");
let frequency = searchTimes.querySelectorAll("b");
frequency[0].textContent = `${history.length}`;
frequency[1].textContent = calculateSavedTime(history.length);
function calculateSavedTime(times) {
@ -145,9 +146,9 @@ function calculateSavedTime(times) {
}
}
let searchingStatsGraph = document.querySelector(".searching-stats-graph");
let searchingStatsText = document.querySelector(".searching-stats-text");
let ol = searchingStatsText.querySelector("ol");
let searchStatsGraph = document.querySelector(".search-stats-graph");
let searchStatsText = document.querySelector(".search-stats-text");
let ol = searchStatsText.querySelector("ol");
stats.sort((a, b) => {
// Others always the last
if (a.name === "Others" || b.name === "Others") return 0;
@ -160,7 +161,7 @@ stats.forEach(({ name, color, value }) => {
<span class="">${(value / history.length * 100).toFixed(1)}%<span>`;
ol.append(li);
if (value > 0) {
searchingStatsGraph.insertAdjacentHTML('beforeend', `<span class="show" style="width: ${value / history.length * 100}%;
searchStatsGraph.insertAdjacentHTML('beforeend', `<span class="show" style="width: ${value / history.length * 100}%;
background-color:${color}"></span>`);
}
});