Some style fixes
This commit is contained in:
@@ -189,6 +189,10 @@ var DetailsWindow = {
|
||||
this.detailsButton.classList.add("button_highlight")
|
||||
this.visible = true;
|
||||
|
||||
// This is a workaround for a chrome bug which makes it so hidden
|
||||
// windows can't be scrolled after they are shown
|
||||
this.popupDiv.focus();
|
||||
|
||||
if (this.graph === 0) {
|
||||
this.renderGraph();
|
||||
}
|
||||
@@ -301,6 +305,9 @@ var DetailsWindow = {
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: "Downloads"
|
||||
},
|
||||
gridLines: {
|
||||
color: "rgba(100, 255, 100, .1)"
|
||||
}
|
||||
}, {
|
||||
type: "linear",
|
||||
@@ -312,7 +319,14 @@ var DetailsWindow = {
|
||||
labelString: "Views"
|
||||
},
|
||||
gridLines: {
|
||||
color: "rgba(0, 0, 0, 0)"
|
||||
color: "rgba(128, 128, 255, .2)"
|
||||
}
|
||||
}
|
||||
],
|
||||
xAxes: [
|
||||
{
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
@@ -194,8 +194,10 @@ body{
|
||||
.popup {
|
||||
position: fixed;
|
||||
visibility: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
opacity: 0;
|
||||
transition: visibility 1s, opacity 1s;
|
||||
transition: visibility .5s, opacity .5s;
|
||||
background-color: var(--body_color);
|
||||
border-color: var(--accent_color_dark_border);
|
||||
max-height: 100%;
|
||||
@@ -207,13 +209,18 @@ body{
|
||||
box-sizing: border-box;
|
||||
text-align: left;
|
||||
box-shadow: var(--shadow_color) 0px 0px 50px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.popup .highlight_light {
|
||||
.popup > .highlight_light {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
.popup > .content_area {
|
||||
flex: 1;
|
||||
overflow-y: scroll;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.details_popup{
|
||||
overflow-y: scroll;
|
||||
width: 1500px;
|
||||
height: 800px;
|
||||
z-index: 100;
|
||||
|
||||
@@ -22,7 +22,6 @@
|
||||
}
|
||||
.file_manager > .nav_bar :first-child {margin-left: 5px;}
|
||||
.file_manager > .nav_bar :last-child {margin-right: 5px;}
|
||||
.file_manager > .nav_bar > button {flex: 0;}
|
||||
.file_manager > .nav_bar > .breadcrumbs {flex: 1; margin: 1px 10px; min-width: 100px;}
|
||||
.file_manager > .status_bar {text-align: left;}
|
||||
.file_manager > .directory_area {
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
<script src="/res/script/jquery.js"></script>
|
||||
<script src="/res/misc/chartjs/Chart.min.js"></script>
|
||||
<script>
|
||||
$.get(apiEndpoint+"/admin/files/timeseries/10", function(response){
|
||||
$.get(apiEndpoint+"/admin/files/timeseries/14", function(response){
|
||||
console.log(response);
|
||||
if (response.success) {
|
||||
var ctx = document.getElementById('bandwidth_chart');
|
||||
@@ -35,7 +35,7 @@
|
||||
labels: response.labels,
|
||||
datasets: [
|
||||
{
|
||||
label: "Downloads",
|
||||
label: "Bandwidth",
|
||||
backgroundColor: "rgba(100, 255, 100, .1)",
|
||||
borderColor: "rgba(100, 255, 100, .8)",
|
||||
borderWidth: 2,
|
||||
@@ -44,7 +44,7 @@
|
||||
data: response.downloads
|
||||
}, {
|
||||
label: "Views",
|
||||
backgroundColor: "rgba(128, 128, 255, .1)",
|
||||
backgroundColor: "rgba(128, 128, 255, .2)",
|
||||
borderColor: "rgba(128, 128, 255, .8)",
|
||||
borderWidth: 2,
|
||||
fill: true,
|
||||
@@ -71,6 +71,14 @@
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: "Bandwidth"
|
||||
},
|
||||
ticks: {
|
||||
callback: function(value, index, values) {
|
||||
return (value/1e9) + " GB";
|
||||
}
|
||||
},
|
||||
gridLines: {
|
||||
color: "rgba(100, 255, 100, .1)"
|
||||
}
|
||||
}, {
|
||||
type: "linear",
|
||||
@@ -82,7 +90,14 @@
|
||||
labelString: "Views"
|
||||
},
|
||||
gridLines: {
|
||||
color: "rgba(0, 0, 0, 0)"
|
||||
color: "rgba(128, 128, 255, .2)"
|
||||
}
|
||||
}
|
||||
],
|
||||
xAxes: [
|
||||
{
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
@@ -112,46 +112,48 @@
|
||||
File Info
|
||||
<button style="position: absolute; top: 3px; right: 3px;" class="button_red" onclick="DetailsWindow.toggle();">X</button>
|
||||
</div>
|
||||
<span id="info_file_details"></span>
|
||||
<span id="info_about">
|
||||
<h3>Downloads and views</h3>
|
||||
<div id="chart_container" class="chart-container" style="position: relative; width: 100%; height: auto;">
|
||||
<canvas id="bandwidth_chart"></canvas>
|
||||
</div>
|
||||
<p style="text-align: center">
|
||||
Chart rendered by the amazing <a href="https://www.chartjs.org/" target="_blank">Chart.js</a>.
|
||||
</p>
|
||||
<div class="content_area">
|
||||
<span id="info_file_details"></span>
|
||||
<span id="info_about">
|
||||
<h3>Downloads and views</h3>
|
||||
<div id="chart_container" class="chart-container" style="position: relative; width: 100%; height: auto;">
|
||||
<canvas id="bandwidth_chart"></canvas>
|
||||
</div>
|
||||
<p style="text-align: center">
|
||||
Chart rendered by the amazing <a href="https://www.chartjs.org/" target="_blank">Chart.js</a>.
|
||||
</p>
|
||||
|
||||
<h3>About</h3>
|
||||
Pixeldrain is a file sharing platform.
|
||||
<a href="/" target="_blank">Visit the home page for more information.</a>
|
||||
<h3>About</h3>
|
||||
Pixeldrain is a file sharing platform.
|
||||
<a href="/" target="_blank">Visit the home page for more information.</a>
|
||||
|
||||
<h3>Keyboard Controls</h3>
|
||||
<table>
|
||||
<tr><td colspan="2">File Shortcuts</td></tr>
|
||||
<tr><td>c</td><td> = Copy URL of this page</td></tr>
|
||||
<tr><td>i</td><td> = Toggle details window (this window)</td></tr>
|
||||
<tr><td>s</td><td> = Download the file you are currently viewing</td></tr>
|
||||
<tr><td colspan="2">List Shortcuts</td></tr>
|
||||
<tr><td>a or ←</td><td> = View previous item in list</td></tr>
|
||||
<tr><td>d or →</td><td> = View next item in list</td></tr>
|
||||
<tr><td>r</td><td> = Toggle shuffle (<b><u>r</u></b>andom)</td></tr>
|
||||
<tr><td>SHIFT + s</td><td> = Download all the files in the list as a zip archive</td></tr>
|
||||
</table>
|
||||
<h3>Keyboard Controls</h3>
|
||||
<table>
|
||||
<tr><td colspan="2">File Shortcuts</td></tr>
|
||||
<tr><td>c</td><td> = Copy URL of this page</td></tr>
|
||||
<tr><td>i</td><td> = Toggle details window (this window)</td></tr>
|
||||
<tr><td>s</td><td> = Download the file you are currently viewing</td></tr>
|
||||
<tr><td colspan="2">List Shortcuts</td></tr>
|
||||
<tr><td>a or ←</td><td> = View previous item in list</td></tr>
|
||||
<tr><td>d or →</td><td> = View next item in list</td></tr>
|
||||
<tr><td>r</td><td> = Toggle shuffle (<b><u>r</u></b>andom)</td></tr>
|
||||
<tr><td>SHIFT + s</td><td> = Download all the files in the list as a zip archive</td></tr>
|
||||
</table>
|
||||
|
||||
<h3>Credits</h3>
|
||||
All server side code written by
|
||||
<a target="_blank" href="https://fornaxian.com/">Fornax (me)</a>.
|
||||
<br/>
|
||||
<br/>
|
||||
Code syntax highlighting is by
|
||||
<a target="_blank" href="https://github.com/google/code-prettify">Google Code-prettify</a>.
|
||||
<br/>
|
||||
<br/>
|
||||
Thanks to the Mozilla team for their wonderful PDF viewer
|
||||
<a target="_blank" href="https://github.com/mozilla/pdf.js">pdf.js</a>.
|
||||
<br/>
|
||||
</span>
|
||||
<h3>Credits</h3>
|
||||
All server side code written by
|
||||
<a target="_blank" href="https://fornaxian.com/">Fornax (me)</a>.
|
||||
<br/>
|
||||
<br/>
|
||||
Code syntax highlighting is by
|
||||
<a target="_blank" href="https://github.com/google/code-prettify">Google Code-prettify</a>.
|
||||
<br/>
|
||||
<br/>
|
||||
Thanks to the Mozilla team for their wonderful PDF viewer
|
||||
<a target="_blank" href="https://github.com/mozilla/pdf.js">pdf.js</a>.
|
||||
<br/>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div id="captcha_popup" class="popup captcha_popup border_bottom">
|
||||
<div id="captcha_popup_title" class="highlight_light border_top border_bottom"></div>
|
||||
|
||||
Reference in New Issue
Block a user