ui for folder monitoring

master
Steve L. Nyemba 8 years ago
parent fb4487bfdc
commit b54615aca1

@ -58,7 +58,7 @@ def procs(id):
learn[label] = row learn[label] = row
r = {} r = {}
for label in data : for label in data :
if label not in ['learn'] : if label not in ['learn','folders'] :
index = len(data[label]) - 1 index = len(data[label]) - 1
row = data[label][index] row = data[label][index]
r[label] = row r[label] = row
@ -112,8 +112,11 @@ def sandbox():
conf = p['config'] conf = p['config']
for id in conf: for id in conf:
handler.init(conf[id]) try:
r.append (dict(handler.composite(),**{"label":id})) handler.init(conf[id])
r.append (dict(handler.composite(),**{"label":id}))
except Exception,e:
pass
else: else:
r = [] r = []
@ -241,6 +244,19 @@ def anomalies_status():
id = request.args['id'] id = request.args['id']
r = info r = info
return json.dumps(r) return json.dumps(r)
@app.route('/folders')
def get_folders():
global CONFIG
p = CONFIG['store']['args']
class_read = CONFIG['store']['class']['read']
gReader = factory.instance(type=class_read,args=p)
d = gReader.read()
if 'folders' in d:
d = d['folders']
else:
d = []
return json.dumps(d)
if __name__== '__main__': if __name__== '__main__':

@ -98,3 +98,6 @@ input[type=text]:focus{
.good{ color:green} .good{ color:green}
.fa-warning, .warning{color:orange} .fa-warning, .warning{color:orange}
.number {font-size:42px; font-weight:lighter; padding:2px; margin:2px;} .number {font-size:42px; font-weight:lighter; padding:2px; margin:2px;}
.action {cursor:pointer; padding:2px; margin:2px; border:1px solid transparent}
.action:hover { border-bottom-color:#4682B4}

@ -259,6 +259,7 @@ monitor.processes.summary.init = function(logs){
} }
jx.utils.patterns.visitor(logs[id], function (row) { jx.utils.patterns.visitor(logs[id], function (row) {
if (row.status.match(/running/i)) { if (row.status.match(/running/i)) {
xr[index] += 1 xr[index] += 1
@ -284,6 +285,7 @@ monitor.sandbox.init = function () {
httpclient.get('/sandbox', function (x) { httpclient.get('/sandbox', function (x) {
var r = JSON.parse(x.responseText) var r = JSON.parse(x.responseText)
if (r.length > 0){ if (r.length > 0){
monitor.sandbox.render(r); monitor.sandbox.render(r);
} }
@ -307,7 +309,7 @@ monitor.sandbox.render = function (logs) {
options.pageSize = 4 options.pageSize = 4
options.pageIndex = 1 options.pageIndex = 1
options.pageButtonCount = 4 options.pageButtonCount = 4
options.pagerContainer = '#sandbox_pager' options.pagerContainer = '#folders_pager'
options.pagerFormat = "{prev} Page {pageIndex} of {pageCount} {next}" options.pagerFormat = "{prev} Page {pageIndex} of {pageCount} {next}"
options.pagePrevText = '<i class="fa fa-chevron-left"></i>' options.pagePrevText = '<i class="fa fa-chevron-left"></i>'
options.pageNextText = "<i class='fa fa-chevron-right small' title='Next'> </i>"; options.pageNextText = "<i class='fa fa-chevron-right small' title='Next'> </i>";
@ -348,6 +350,100 @@ monitor.sandbox.render = function (logs) {
} }
monitor.folders = {}
monitor.folders.init = function () {
var httpclient = HttpClient.instance()
httpclient.get('/folders', function (x) {
var r = JSON.parse(x.responseText)
r = jx.utils.patterns.visitor(r, function (row) {
return row[0]
})
monitor.folders.render.init(r)
})
}
monitor.folders.render = {}
monitor.folders.render.init = function (data) {
monitor.folders.render.summary(data)
}
monitor.folders.render.details = function (data) {
var context = jx.dom.get.instance('CANVAS')
var frame = $('#chartfolder')
jx.dom.set.value('chartfolder', '')
context.width = $(frame).width()
context.height= $(frame).height()
var conf = { type: 'line',responsive:true }
conf.data = {}
conf.options = { legend: { position: 'bottom' } }
conf.options.scales = {}
conf.options.scales.yAxes = [
{id:'0',scaleLabel:{display:true,labelString:'Age In Days'},ticks:{min:0,beginAtZero:true},gridLines: {display:false}},
{id:'1',position:'right',scaleLabel:{display:true,labelString:'Size in MB'},ticks:{min:0,stepSize:1,beginAtZero:true},gridLines: {display:false}}
]
conf.options.scales.xAxes = [{gridLines: {display:false}}]
var age = {yAxisID:'0', label: 'File Age (Days)', data:data.age ,borderColor:COLORS[187],fill:true,borderWidth:1}
var size = {yAxisID:'1',label : 'File Size (MB)',data:data.size,borderColor:COLORS[32],fill:true,borderWidth:1}
// age.data = [{ x: 10, y: 30 }, {x:20,y:60}]
// size.data= data.size
age.data = data.age
x_ = jx.utils.vector('x', age.data)
z_ = jx.utils.vector('x',size.data)
conf.data.labels = jx.utils.unique(jx.math.sets.union(x_,z_))
conf.data.datasets = [age,size]
console.log(conf)
jx.dom.append('chartfolder',context)
var chart = new Chart(context,conf)
}
monitor.folders.render.summary = function (data) {
jx.dom.set.value('gridfolders', '')
var options = {
width: $('#gridfolders').width(), height:'auto'
}
options.paging = true
options.pageSize = 4
options.pageIndex = 1
options.pageButtonCount = 4
options.pagerContainer = '#latest_process_pager'
options.pagerFormat= "{prev} Page {pageIndex} of {pageCount} {next}"
options.pagePrevText= '<i class="fa fa-chevron-left"></i>'
options.pageNextText= "<i class='fa fa-chevron-right small' title='Next'> </i>"
options.data = data
options.rowClass = function (item, index,evt) {
return 'small'
}
options.rowClick = function(args){
var item = args.item
age = jx.utils.patterns.visitor(item.details.age, function (row) {
return {y:row[0],x:row[1]}
})
size = jx.utils.patterns.visitor(item.details.size, function (row) {
return {y:row[0],x:row[1]}
})
monitor.folders.render.details({age:age,size:size})
}
options.autoload = true
options.fields = [
{ name: 'label', type: 'text', title: "Folder Name", headercss: "small bold", css: "small"},
{ name: "summary.age", type: "number", title: "Oldest File (Days)", headercss: "small bold" , width:'64px'},
{ name: "summary.size", type: "number", title: "Size (MB)", type: "number", headercss: "small bold" },
{ name: "summary.count", type: "number", title: "File Count", type: "number", headercss: "small bold" }
]
var grid = $('#gridfolders').jsGrid(options) ;
}
/** /**
* Socket handler, check for learning status * Socket handler, check for learning status
*/ */

@ -12,13 +12,15 @@
<script src="{{context}}/static/js/jx/rpc.js"></script> <script src="{{context}}/static/js/jx/rpc.js"></script>
<script src="{{context}}/static/js/jx/dom.js"></script> <script src="{{context}}/static/js/jx/dom.js"></script>
<script src="{{context}}/static/js/jx/utils.js"></script> <script src="{{context}}/static/js/jx/utils.js"></script>
<script src="{{context}}/static/js/jx/ext/math.js"></script>
<script src="{{ context }}/static/js/jsgrid/jsgrid.js"></script> <script src="{{ context }}/static/js/jsgrid/jsgrid.js"></script>
<script src="{{context}}/static/js/colors.js"></script> <script src="{{context}}/static/js/colors.js"></script>
<script src="{{context}}/static/js/dashboard.js"></script> <script src="{{context}}/static/js/dashboard.js"></script>
<title>iMonitor</title> <title>iMonitor</title>
<script> <script>
$(document).ready(function(){ $(document).ready(function(){
monitor.processes.fetch() // monitor.processes.fetch()
monitor.folders.init()
}) })
</script> </script>
<body> <body>
@ -71,15 +73,24 @@
<div class="small">Last Lookup <span id="sandbox_date"></span></div> <div class="small">Last Lookup <span id="sandbox_date"></span></div>
</div> </div>
<div class="" style="margin-top:10px"> <div class="" style="margin-top:10px; height:105px">
<div id="sandbox_status" class="grid"> <div id="sandbox_status" class="grid">
</div> </div>
<div id="sandbox_pager"></div> <div id="sandbox_pager"></div>
</div> </div>
<div> <div>
<div class="bold">Java Management eXtension Container</div> <div class="small">
<div class="small">This applies to Tomcat, Tomee and derived products</div> <div class="bold">Smart Folder Analysis/Monitoring</div>
<div>Powered By Machine Learning</div>
</div>
<div style="margin-top:10px; height:150px">
<div id="gridfolders"></div>
<div id="folderspager"></div>
</div>
<div id="chartfolder" ></div>
</div> </div>
</div> </div>

Loading…
Cancel
Save