Some layout fixes
This commit is contained in:
@@ -14,8 +14,8 @@
|
||||
|
||||
<h2>Actions</h2>
|
||||
<ul>
|
||||
<li><a href="/user/change_password">Change my password</a></li>
|
||||
<li><a href="/logout">Log out</a></li>
|
||||
<li><a href="/user/change_password" class="button">Change my password</a></li>
|
||||
<li><a href="/logout" class="button">Log out</a></li>
|
||||
</ul>
|
||||
|
||||
<h2>Your most recently uploaded files:</h2>
|
||||
|
||||
@@ -13,6 +13,14 @@
|
||||
{{if $isAdmin.IsAdmin}}
|
||||
|
||||
<h3>Bandwidth and views</h3>
|
||||
<div class="highlight_dark">
|
||||
<button onclick="days = 7; interval = 60; setData();">Week</button>
|
||||
<button onclick="days = 14; interval = 60; setData();">Two Weeks</button>
|
||||
<button onclick="days = 21; interval = 60; setData();">Three Weeks</button>
|
||||
<button onclick="days = 30; interval = 1440; setData();">Month</button>
|
||||
<button onclick="days = 60; interval = 1440; setData();">Two Months</button>
|
||||
<button onclick="days = 91; interval = 1440; setData();">Quarter</button>
|
||||
</div>
|
||||
<div id="chart_container" class="chart-container" style="position: relative; width: 100%; height: auto;">
|
||||
<canvas id="bandwidth_chart"></canvas>
|
||||
</div>
|
||||
@@ -20,98 +28,103 @@
|
||||
<script src="/res/script/jquery.js"></script>
|
||||
<script src="/res/misc/chartjs/Chart.min.js"></script>
|
||||
<script>
|
||||
$.get(apiEndpoint+"/admin/files/timeseries/14?interval=60", function(response){
|
||||
console.log(response);
|
||||
if (response.success) {
|
||||
var ctx = document.getElementById('bandwidth_chart');
|
||||
Chart.defaults.global.defaultFontColor = "#b3b3b3";
|
||||
Chart.defaults.global.defaultFontSize = 16;
|
||||
Chart.defaults.global.defaultFontFamily = "Ubuntu";
|
||||
new Chart(
|
||||
document.getElementById('bandwidth_chart'),
|
||||
{
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: response.labels,
|
||||
datasets: [
|
||||
{
|
||||
label: "Bandwidth",
|
||||
backgroundColor: "rgba(100, 255, 100, .1)",
|
||||
borderColor: "rgba(100, 255, 100, .8)",
|
||||
borderWidth: 2,
|
||||
fill: true,
|
||||
yAxisID: "y_bandwidth",
|
||||
data: response.downloads
|
||||
}, {
|
||||
label: "Views",
|
||||
backgroundColor: "rgba(128, 128, 255, .2)",
|
||||
borderColor: "rgba(128, 128, 255, .8)",
|
||||
borderWidth: 2,
|
||||
fill: true,
|
||||
yAxisID: "y_views",
|
||||
data: response.views
|
||||
Chart.defaults.global.defaultFontColor = "#b3b3b3";
|
||||
Chart.defaults.global.defaultFontSize = 15;
|
||||
Chart.defaults.global.defaultFontFamily = "Ubuntu";
|
||||
Chart.defaults.global.aspectRatio = 2.5;
|
||||
Chart.defaults.global.elements.point.radius = 0;
|
||||
Chart.defaults.global.tooltips.mode = "index";
|
||||
Chart.defaults.global.tooltips.axis = "x";
|
||||
Chart.defaults.global.tooltips.intersect = false;
|
||||
|
||||
var days = 7;
|
||||
var interval = 60;
|
||||
var graph = new Chart(
|
||||
document.getElementById('bandwidth_chart'),
|
||||
{
|
||||
type: 'line',
|
||||
data: {
|
||||
datasets: [
|
||||
{
|
||||
label: "Bandwidth",
|
||||
backgroundColor: "rgba(100, 255, 100, .1)",
|
||||
borderColor: "rgba(100, 255, 100, .8)",
|
||||
borderWidth: 1,
|
||||
fill: true,
|
||||
yAxisID: "y_bandwidth"
|
||||
}, {
|
||||
label: "Views",
|
||||
backgroundColor: "rgba(128, 128, 255, .2)",
|
||||
borderColor: "rgba(128, 128, 255, .8)",
|
||||
borderWidth: 1,
|
||||
fill: true,
|
||||
yAxisID: "y_views"
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
scales: {
|
||||
yAxes: [
|
||||
{
|
||||
type: "linear",
|
||||
display: true,
|
||||
position: "left",
|
||||
id: "y_bandwidth",
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: "Bandwidth"
|
||||
},
|
||||
ticks: {
|
||||
callback: function(value, index, values) {
|
||||
return Math.round((value*8/1e6)/(interval*60)) + " Mbps";
|
||||
}
|
||||
},
|
||||
gridLines: {
|
||||
color: "rgba(100, 255, 100, .1)"
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
stacked: false,
|
||||
aspectRatio: 3,
|
||||
tooltips: {
|
||||
mode: "index",
|
||||
intersect: false,
|
||||
axis: "x"
|
||||
},
|
||||
scales: {
|
||||
yAxes: [
|
||||
{
|
||||
type: "linear",
|
||||
display: true,
|
||||
position: "left",
|
||||
id: "y_bandwidth",
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: "Bandwidth"
|
||||
},
|
||||
ticks: {
|
||||
callback: function(value, index, values) {
|
||||
return (value/1e9) + " GB";
|
||||
}
|
||||
},
|
||||
gridLines: {
|
||||
color: "rgba(100, 255, 100, .1)"
|
||||
}
|
||||
}, {
|
||||
type: "linear",
|
||||
display: true,
|
||||
position: "right",
|
||||
id: "y_views",
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: "Views"
|
||||
},
|
||||
gridLines: {
|
||||
color: "rgba(128, 128, 255, .2)"
|
||||
}
|
||||
}
|
||||
],
|
||||
xAxes: [
|
||||
{
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
elements: {
|
||||
point: {
|
||||
radius: 0
|
||||
}, {
|
||||
type: "linear",
|
||||
display: true,
|
||||
position: "right",
|
||||
id: "y_views",
|
||||
scaleLabel: {
|
||||
display: true,
|
||||
labelString: "Views"
|
||||
},
|
||||
gridLines: {
|
||||
color: "rgba(128, 128, 255, .2)"
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
xAxes: [
|
||||
{
|
||||
ticks: {
|
||||
maxRotation: 20
|
||||
},
|
||||
gridLines: {
|
||||
display: false
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
);
|
||||
|
||||
function setData(){
|
||||
this.class = "button_highlight";
|
||||
$.get(apiEndpoint+"/admin/files/timeseries?days="+days+"&interval="+interval, function(response){
|
||||
console.log(response);
|
||||
if (response.success) {
|
||||
window.graph.data.labels = response.labels;
|
||||
window.graph.data.datasets[0].data = response.downloads;
|
||||
window.graph.data.datasets[1].data = response.views;
|
||||
window.graph.update();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
setData();
|
||||
</script>
|
||||
|
||||
{{else}}
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
.api_doc_details{
|
||||
border-top: 1px solid;
|
||||
border-bottom: 1px solid;
|
||||
margin: 15px -8px 15px -8px;
|
||||
margin: 15px 0 15px 0;
|
||||
}
|
||||
.api_doc_details > summary {
|
||||
padding: 2px;
|
||||
|
||||
@@ -73,37 +73,29 @@
|
||||
|
||||
<div id="sharebar" class="sidebar">
|
||||
Share on:<br/>
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('mailto:please@set.address?subject=File%20on%20PixelDrain&body=You%20can%20view%20it%20here%20' + window.location.href);">
|
||||
<img src="/res/img/social_email.png" alt="Share on E-Mail" style="width:40px; height: 40px;"/>
|
||||
<br/>E-Mail
|
||||
</button>
|
||||
<button class="sharebar-button button_full_width" onclick="window.open('https://www.reddit.com/submit?url=' + window.location.href);">
|
||||
<img src="/res/img/social_reddit.png" alt="Share on Reddit" style="width:40px; height: 40px;"/>
|
||||
<br/>Reddit
|
||||
</button>
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('https://voat.co/submit?linkpost=true&url=' + window.location.href);">
|
||||
<img src="/res/img/social_voat.png" alt="Share on Voat" style="width:40px; height: 40px;"/>
|
||||
<br/>Voat
|
||||
</button>
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('http://www.facebook.com/sharer.php?u=' + window.location.href);">
|
||||
<img src="/res/img/social_facebook.png" alt="Share on Facebook" style="width:40px; height: 40px;"/>
|
||||
<br/>Facebook
|
||||
</button>
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('https://twitter.com/share?text=Check%20out%20this%20file%20on%20%23Pixeldrain&url=' + window.location.href);">
|
||||
<img src="/res/img/social_twitter.png" alt="Share on Twitter" style="width:40px; height: 40px;"/>
|
||||
<br/>Twitter
|
||||
</button>
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('https://plus.google.com/share?url=' + window.location.href);">
|
||||
<img src="/res/img/social_googleplus.png" alt="Share on Google Plus" style="width:40px; height: 40px;"/>
|
||||
<br/>Google+
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('http://www.facebook.com/sharer.php?u=' + window.location.href);">
|
||||
<img src="/res/img/social_facebook.png" alt="Share on Facebook" style="width:40px; height: 40px;"/>
|
||||
<br/>Facebook
|
||||
</button>
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('http://www.tumblr.com/share/link?url=' + window.location.href);">
|
||||
<img src="/res/img/social_tumblr.png" alt="Share on Tumblr" style="width:40px; height: 40px;"/>
|
||||
<br/>Tumblr
|
||||
</button>
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('http://www.stumbleupon.com/submit?url=' + window.location.href);">
|
||||
<img src="/res/img/social_stumbleupon.png" alt="Share on StumbleUpon" style="width:40px; height: 40px;"/>
|
||||
<br/>StumbleUpon
|
||||
</button>
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('mailto:please@set.address?subject=File%20on%20PixelDrain&body=You%20can%20view%20it%20here%20' + window.location.href);">
|
||||
<img src="/res/img/social_email.png" alt="Share on E-Mail" style="width:40px; height: 40px;"/>
|
||||
<br/>E-Mail
|
||||
<button class="sharebar-button button_full_width" onClick="window.open('https://voat.co/submit?linkpost=true&url=' + window.location.href);">
|
||||
<img src="/res/img/social_voat.png" alt="Share on Voat" style="width:40px; height: 40px;"/>
|
||||
<br/>Voat
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -157,7 +149,7 @@
|
||||
</div>
|
||||
<div id="captcha_popup" class="popup captcha_popup border_bottom">
|
||||
<div id="captcha_popup_title" class="highlight_light border_top border_bottom"></div>
|
||||
<div id="captcha_popup_content"></div>
|
||||
<div id="captcha_popup_content" class="content_area"></div>
|
||||
<br/>
|
||||
<div id="captcha_popup_captcha" style="text-align: center;"></div>
|
||||
</div>
|
||||
|
||||
@@ -48,12 +48,16 @@
|
||||
</p>
|
||||
|
||||
<h2>Style selector</h2>
|
||||
<input type="radio" id="style_default" name="style"><label for="style_default">Pixeldrain Style</label><br/>
|
||||
<input type="radio" id="style_solarized_dark" name="style"><label for="style_solarized_dark">Solarized Dark Style</label><br/>
|
||||
<input type="radio" id="style_maroon" name="style"><label for="style_maroon">Maroon Style</label><br/>
|
||||
<input type="radio" id="style_hacker" name="style"><label for="style_hacker">Hacker Style</label><br/>
|
||||
<input type="radio" id="style_canta" name="style"><label for="style_canta">Canta Style</label>
|
||||
(Inspired by <a href="https://github.com/vinceliuice/Canta-theme" target="_blank">Canta GTK</a>)<br/>
|
||||
<div class="indent">
|
||||
<input type="radio" id="style_default" name="style"><label for="style_default">Pixeldrain Style</label><br/>
|
||||
<input type="radio" id="style_solarized_dark" name="style"><label for="style_solarized_dark">Solarized Dark Style</label><br/>
|
||||
<input type="radio" id="style_maroon" name="style"><label for="style_maroon">Maroon Style</label><br/>
|
||||
<input type="radio" id="style_hacker" name="style"><label for="style_hacker">Hacker Style</label><br/>
|
||||
<input type="radio" id="style_canta" name="style"><label for="style_canta">Canta Style</label>
|
||||
(Inspired by <a href="https://github.com/vinceliuice/Canta-theme" target="_blank">Canta GTK</a>)<br/>
|
||||
<!--<input type="radio" id="style_arc" name="style"><label for="style_arc">Arc Style</label>
|
||||
(Inspired by <a href="https://github.com/horst3180/Arc-theme" target="_blank">Arc GTK</a>)<br/>-->
|
||||
</div>
|
||||
|
||||
<h2>Questions and Answers</h2>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user