Add disk usage. need to fix change_directory function

This commit is contained in:
kyg516 2016-09-25 01:24:28 +09:00
parent dd2f52a7d1
commit b10c6803ac
7 changed files with 139 additions and 95 deletions

View File

@ -2,6 +2,7 @@ class ApplicationController < ActionController::Base
# Prevent CSRF attacks by raising an exception.
# For APIs, you may want to use :null_session instead.
# protect_from_forgery with: :exception
include ApplicationHelper
def require_login
unless user_signed_in?
@ -32,29 +33,8 @@ class ApplicationController < ActionController::Base
return df
end
def file_directory(dir)
@current_dir = dir
dir_list = `ls #{@current_dir} -l`
parsing_list = dir_list.split("\n")
@files = Array.new
file = Hash.new
@total_list = parsing_list[0]
for t in 1..(parsing_list.length-1)
parsing_file = parsing_list[t].split(" ")
file["auth"] = parsing_file[0]
file["size"] = parsing_file[4]
file["date"] = parsing_file[5] + " " + parsing_file[6] + " " + parsing_file[7]
file["name"] = parsing_file[8]
@files << file
file = Hash.new
end
puts @files
return @files
end
def checkDir
files = file_directory(params[:path])
render :json => {:file => files , :current => @current_dir}
@current_dir = params[:path]
render :json => {:file => files(@current_dir) , :current => @current_dir}
end
end

View File

@ -3,7 +3,6 @@ class HomeController < ApplicationController
def index
@current_dir = "/mnt"
file_directory(@current_dir)
end
def file_download

View File

@ -2,7 +2,7 @@ class VolumeController < ApplicationController
before_action :require_login
def index
file_directory("/mnt")
@current_dir = "/mnt"
end
def file_upload

View File

@ -51,4 +51,21 @@ module ApplicationHelper
return volumes
end
def files(dir)
files = Array.new
file = Hash.new
output = `ls #{dir} -l`.split("\n")
output.each do |t|
next if t.equal? output.first
s = t.split(" ")
file["auth"] = s[0]
file["size"] = s[4]
file["date"] = s[5] + " " + s[6] + " " + s[7]
file["name"] = s[8]
files << file
file = Hash.new
end
return files
end
end

View File

@ -1,3 +1,28 @@
module HomeHelper
def get_du(dir)
du = Array.new
du_each = Hash.new
command = String.new
if dir.eql? "/"
command = "sudo df /"
s = `#{command}`.split("\n")[1].split(" ")
avail = s[2].to_f + s[3].to_f
else
command << "sudo du -s #{dir}"
avail = `#{command}`.split(" ")[0].to_f
end
command << "sudo du -s #{dir}/*"
puts command
output = `#{command}`.split("\n")
output.each do |t|
du_each['usage'] = t.split(" ")[0].to_f / avail
du_each['file_name'] = t.split(" ")[1].split("/").last
du << du_each
du_each = Hash.new
end
return du
end
end

View File

@ -113,7 +113,6 @@
</ul>
<div class="clearfix"></div>
</div>
<div class="x_content">
<div class="col-md-12 col-sm-12 col-xs-12" id="table_div">
<table id="datatable" class="table table-striped table-bordered jambo_table">
@ -136,7 +135,7 @@
<td></td>
<td></td>
</tr>
<% @files.each do |t| %>
<% (files @current_dir).each do |t| %>
<tr class="dir_delete">
<% if t["auth"][0]=='d'%>
<td style="color:#0d8ade;"><i class="fa fa-folder-open-o"></i>
@ -167,31 +166,53 @@
<div class="col-md-4 col-sm-4 col-xs-12">
<div class="panel panel-body">
<div class="x_title">
<h4>Easy Pie Chart</h4>
<h4>Disk usage</h4>
</div>
<p>Easy pie chart is a jQuery plugin that uses the canvas element to render highly customizable, very easy to implement, simple pie charts for single values.</p>
<div class="row">
<div class="col-xs-4">
<span class="chart" data-percent="86">
<span class="percent"></span>
</span>
<table class="" style="width:100%">
<tr>
<th style="width:37%;">
<p>Chart</p>
</th>
<th>
<div class="col-lg-7 col-md-7 col-sm-7 col-xs-7">
<p class="">Name</p>
</div>
<div class="col-xs-4">
<span class="chart" data-percent="73">
<span class="percent"></span>
</span>
<div class="col-lg-5 col-md-5 col-sm-5 col-xs-5">
<p class="">Usage</p>
</div>
<div class="col-xs-4">
<span class="chart" data-percent="60">
<span class="percent"></span>
</span>
</th>
</tr>
<tr>
<td>
<canvas id="canvas1" height="140" width="140" style="margin: 15px 10px 10px 0"></canvas>
</td>
<td>
<table class="tile_info">
<% (get_du(@current_dir)).each_with_index do |t, index| %>
<tr>
<td>
<p>
<i class="fa fa-square <%= ["blue", "green", "red", "purple", "grey"][index % 5] %>"></i>
<%= t['file_name'] %>
</p>
</td>
<td>
<p>
<%= format("%.2f", t['usage']*100) %>%
</p>
</td>
</tr>
<% end %>
</table>
</td>
</tr>
</table>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
<!-- /disk usage -->
</div>
<div class ="row">
@ -357,6 +378,7 @@ function change_directory(directory){
new_tr += "<a class='pull-right' href='#popup_mkdir'><i class='fa fa-plus'></i><i class='fa fa-folder'></i></a></td>";
new_tr += "<td></td> <td></td> <td></td>"
new_tr += "</tr>";
for( var i = 0; i < result.file.length; i++){
var row_class = i % 2 == 0 ? 'odd' : 'even';
var cur = result.current != "/" ? result.current : '';
@ -374,14 +396,26 @@ function change_directory(directory){
new_tr += "<td>"+result.file[i].auth+"</td>";
new_tr += "<td>"+result.file[i].size+"</td>";
new_tr += "<td>"+result.file[i].date+" <a class='pull-right' onclick='delete_file(" +'"' + cur + "/" + result.file[i].name +'"'+ ")' href='#'><i class='fa fa-trash'></i></a></td>";
new_tr += "</tr>";
}
new_table += new_tr;
new_table += "</tbody></table>"
$("#table_div").append(new_table);
$('#datatable').dataTable( {"bSort": false});
// disk usage
$("table .tile_info").empty();
var new_tr = "";
<% (get_du @current_dir).each_with_index do |t, index| %>
new_tr += "<tr><td>";
new_tr += "<p><i class='fa fa-square <%= ["blue", "green", "red", "purple", "grey"][index % 5] %>''></i>";
new_tr += "<%= t['file_name'] %></td><td>";
new_tr += "<p><%= format("%.2f", t['usage']*100) %>%</p>"
new_tr += "</p></td></tr>"
<% end %>
$("table .tile_info").append(new_tr);
draw_chart();
}
})
}
@ -389,57 +423,46 @@ function change_directory(directory){
<!-- On document ready -->
<script>
$(document).ready(function() {
$('document').ready(function() {
$('#datatable').dataTable( {"bSort": false});
draw_chart();
});
</script>
<!-- Easy pie chart -->
<!-- Doughnut Chart -->
<script>
$(function() {
$('.chart').easyPieChart({
easing: 'easeOutBounce',
lineWidth: '6',
barColor: '#75BCDD',
onStep: function(from, to, percent) {
$(this.el).find('.percent').text(Math.round(percent));
}
});
var chart = window.chart = $('.chart').data('easyPieChart');
$('.js_update').on('click', function() {
chart.update(Math.random() * 200 - 100);
});
//hover and retain popover when on popover content
var originalLeave = $.fn.popover.Constructor.prototype.leave;
$.fn.popover.Constructor.prototype.leave = function(obj) {
var self = obj instanceof this.constructor ?
obj : $(obj.currentTarget)[this.type](this.getDelegateOptions()).data('bs.' + this.type)
var container, timeout;
originalLeave.call(this, obj);
if (obj.currentTarget) {
container = $(obj.currentTarget).siblings('.popover')
timeout = self.timeout;
container.one('mouseenter', function() {
//We entered the actual popover call off the dogs
clearTimeout(timeout);
//Let's monitor popover content instead
container.one('mouseleave', function() {
$.fn.popover.Constructor.prototype.leave.call(self, self);
});
})
}
function draw_chart() {
var options = {
legend: false,
responsive: false
};
$('body').popover({
selector: '[data-popover]',
trigger: 'click hover',
delay: {
show: 50,
hide: 400
}
});
var colors = ["#3498DB", "#26B99A", "#E74C3C", "#9B59B6", "#BDC3C7"];
var labels = [];
var data = [];
var backgroundColor = [];
var hoverBackgroundColor = [];
<% (get_du(@current_dir)).each_with_index do |t, index| %>
labels.push("<%= t['file_name'] %>");
data.push("<%= t['usage'] %>");
backgroundColor.push(colors[<%= index % 5 %>]);
hoverBackgroundColor.push(colors[<%= index % 5 %>]);
<% end %>
new Chart(document.getElementById("canvas1"), {
type: 'doughnut',
tooltipFillColor: "rgba(51, 51, 51, 0.55)",
data: {
labels: labels,
datasets: [{
data: data,
backgroundColor: backgroundColor,
hoverBackgroundColor: hoverBackgroundColor
}]
},
options: options
});
};
</script>
<!-- /Doughnut Chart -->

View File

@ -83,7 +83,7 @@
<td></td>
<td></td>
</tr>
<% @files.each do |t| %>
<% (files @current_dir).each do |t| %>
<% if t["auth"][0]=='d' %>
<tr>
<td style="color:#0d8ade;"><i class="fa fa-folder-open-o"></i>