mirror of https://github.com/CIRCL/AIL-framework
Finnished terms-plot-top-set. Also added possibility to add terms to track or blacklist.
Mokaddem
parent
a5117d7cad
commit
fb3dea6bd2
|
|
@ -677,6 +677,18 @@ def terms_plot_tool():
|
|||
return render_template("terms_plot_tool.html")
|
||||
|
||||
|
||||
@app.route("/terms_plot_tool_data/")
|
||||
def terms_plot_tool_data():
|
||||
num_day = int(request.args.get('num_day'))
|
||||
term = request.args.get('term')
|
||||
|
||||
if term is None:
|
||||
print 'cc'
|
||||
|
||||
|
||||
return jsonify()
|
||||
|
||||
|
||||
@app.route("/terms_plot_top/")
|
||||
def terms_plot_top():
|
||||
return render_template("terms_plot_top.html")
|
||||
|
|
|
|||
|
|
@ -76,8 +76,8 @@
|
|||
|
||||
<div class="form-group input-group" style="margin-top: 30px;">
|
||||
<span class="input-group-addon"><span class="glyphicon glyphicon-stats"></span></span>
|
||||
<input id="followTermInput" class="form-control" placeholder="Term to plot" type="text" style="max-width: 400px;">
|
||||
<button class="btn btn-info btn-interaction" style="margin-left: 10px;" data-section="followTerm" data-action="add"> Plot a term</button>
|
||||
<input id="TermInput" class="form-control" placeholder="Term to plot" type="text" style="max-width: 400px;">
|
||||
<button id="plot-btn" class="btn btn-info btn-interaction" style="margin-left: 10px;" data-section="followTerm" data-action="add"> Plot a term</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -139,13 +139,62 @@
|
|||
}
|
||||
});
|
||||
|
||||
$( "#amount" ).val( new Date($( ".sliderRange" ).slider( "values", 0 )).toLocaleDateString() +
|
||||
$( "#amount" ).val( new Date($( ".sliderRange" ).slider( "values", 0 )).toLocaleDateString() +
|
||||
" - " + new Date($( ".sliderRange" ).slider( "values", 1 )).toLocaleDateString() );
|
||||
|
||||
$('#plot_btn').click(plotData);
|
||||
$('#plot-btn').click(plotData);
|
||||
|
||||
});
|
||||
</script>
|
||||
|
||||
<script>
|
||||
var graph_options = {
|
||||
series: {
|
||||
lines: {
|
||||
show: true,
|
||||
lineWidth: 2
|
||||
},
|
||||
bars: {show: false, barWidth: 60*60*1000},
|
||||
shadowSize: 0
|
||||
},
|
||||
grid: {
|
||||
hoverable: true,
|
||||
clickable: true,
|
||||
tickColor: "#f9f9f9",
|
||||
borderWidth: 0
|
||||
},
|
||||
xaxis: {
|
||||
mode: "time",
|
||||
timeformat: "%m/%d",
|
||||
minTickSize: [1, "day"]
|
||||
},
|
||||
yaxis: {
|
||||
autoscaleMargin: 0.1,
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
function plotData(){
|
||||
var curthis = $(this);
|
||||
var term = $('#TermInput').val();
|
||||
console.log(term);
|
||||
|
||||
$.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_month, num_day: 31 }, function(data, status){
|
||||
var to_plot = [];
|
||||
for(i=0; i<data.length; i++) {
|
||||
var curr_data = [];
|
||||
for(j=0; j<data[i][1].length; j++) {
|
||||
curr_data.push([data[i][1][j][0]*1000, data[i][1][j][1]]);
|
||||
}
|
||||
to_plot.push({ data: curr_data, label: data[i][0]});
|
||||
}
|
||||
var plot = $.plot($("#graph"), to_plot, graph_options);
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -307,6 +307,10 @@ set_today = "TopTermFreq_set_day";
|
|||
set_week = "TopTermFreq_set_week";
|
||||
set_month = "TopTermFreq_set_month";
|
||||
|
||||
var plot_today;
|
||||
var plot_week;
|
||||
var plot_month;
|
||||
|
||||
var promises = []; // Used to know when everything has been received
|
||||
|
||||
promises.push($.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_today, num_day: 1 }, function(data, status){
|
||||
|
|
@ -323,15 +327,14 @@ promises.push($.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_today
|
|||
}
|
||||
to_plot.push({ data: curr_data, label: data[i][0]});
|
||||
if ( i < (data.length/2))
|
||||
table_today.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("graph-today", data[i][0])+"</td></tr>")
|
||||
table_today.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("today", data[i][0])+"</td></tr>")
|
||||
else
|
||||
table_today2.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("graph-today", data[i][0])+"</td></tr>")
|
||||
table_today2.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("today", data[i][0])+"</td></tr>")
|
||||
}
|
||||
var plot_today = $.plot($("#graph-today"), to_plot, graph_options);
|
||||
plot_today = $.plot($("#graph-today"), to_plot, graph_options);
|
||||
}));
|
||||
|
||||
promises.push($.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_week, num_day: 7 }, function(data, status){
|
||||
console.log(data);
|
||||
data.sort(function(a, b){return b[2]-a[2];});
|
||||
// Sort data
|
||||
var table = $("#table-week")
|
||||
|
|
@ -344,15 +347,14 @@ promises.push($.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_week,
|
|||
}
|
||||
to_plot.push({ data: curr_data, label: data[i][0]});
|
||||
if ( i < (data.length/2))
|
||||
table.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("graph-week", data[i][0])+"</td></tr>")
|
||||
table.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("week", data[i][0])+"</td></tr>")
|
||||
else
|
||||
table2.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("graph-week", data[i][0])+"</td></tr>")
|
||||
table2.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("week", data[i][0])+"</td></tr>")
|
||||
}
|
||||
var plot_week = $.plot($("#graph-week"), to_plot, graph_options);
|
||||
plot_week = $.plot($("#graph-week"), to_plot, graph_options);
|
||||
}));
|
||||
|
||||
promises.push($.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_month, num_day: 31 }, function(data, status){
|
||||
console.log(data);
|
||||
data.sort(function(a, b){return b[2]-a[2];});
|
||||
// Sort data
|
||||
var table = $("#table-month")
|
||||
|
|
@ -365,11 +367,11 @@ promises.push($.getJSON("{{ url_for('terms_plot_top_data') }}", { set: set_month
|
|||
}
|
||||
to_plot.push({ data: curr_data, label: data[i][0]});
|
||||
if ( i < (data.length/2))
|
||||
table.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("graph-month", data[i][0])+"</td></tr>")
|
||||
table.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("month", data[i][0])+"</td></tr>")
|
||||
else
|
||||
table2.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("graph-month", data[i][0])+"</td></tr>")
|
||||
table2.append("<tr><td>"+data[i][0]+"</td><td>"+data[i][2]+"</td><td>"+addbuttons(data[i][0])+"</td><td>"+addcheckbox("month", data[i][0])+"</td></tr>")
|
||||
}
|
||||
var plot_month = $.plot($("#graph-month"), to_plot, graph_options);
|
||||
plot_month = $.plot($("#graph-month"), to_plot, graph_options);
|
||||
}));
|
||||
|
||||
/* When everything has been received, start adding tooltip */
|
||||
|
|
@ -384,9 +386,9 @@ $.when.apply($, promises).done( function (arg) {
|
|||
|
||||
|
||||
function addbuttons(term) {
|
||||
return "<button class=\"fa fa-eye btn-interaction\" data-toggle=\"tooltip\" data-placement=\"right\" title=\"Add to tracked list\" style=\"margin-right: 5px;\""+
|
||||
return "<button class=\"fa fa-eye btn-interaction btn btn-success\" data-toggle=\"tooltip\" data-placement=\"right\" title=\"Add to tracked list\" style=\"margin-right: 5px;\""+
|
||||
"data-section=\"followTerm\" data-term=\""+term+"\"></button>"+
|
||||
"<button class=\"fa fa-eye-slash btn-interaction\" data-toggle=\"tooltip\" data-placement=\"right\" title=\"Add to black-list\""+
|
||||
"<button class=\"fa fa-eye-slash btn-interaction btn btn-danger\" data-toggle=\"tooltip\" data-placement=\"right\" title=\"Add to black-list\""+
|
||||
"data-section=\"blacklistTerm\" data-term=\""+term+"\"></button>";
|
||||
}
|
||||
|
||||
|
|
@ -401,7 +403,6 @@ function perform_operation(){
|
|||
|
||||
var data_to_send = { section: curr_section, action:"add", term: curr_term};
|
||||
|
||||
console.log(data_to_send);
|
||||
$.get("{{ url_for('terms_management_action') }}", data_to_send, function(data, status){
|
||||
if(status == "success") {
|
||||
location.reload();
|
||||
|
|
@ -415,6 +416,44 @@ function hide_or_show() {
|
|||
var checked = $(this).prop('checked')
|
||||
console.log(curr_term + ' ' + graph + ' ' + checked);
|
||||
|
||||
if(graph == "today") {
|
||||
var graphData = plot_today.getData();
|
||||
var index;
|
||||
for(i=0; i<graphData.length; i++){
|
||||
if(graphData[i].label == curr_term){
|
||||
index = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
graphData[index].lines.show = checked;
|
||||
plot_today.setData(graphData);
|
||||
plot_today.draw();
|
||||
} else if (graph == "week") {
|
||||
var graphData = plot_week.getData();
|
||||
var index;
|
||||
for(i=0; i<graphData.length; i++){
|
||||
if(graphData[i].label == curr_term){
|
||||
index = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
graphData[index].lines.show = checked;
|
||||
plot_week.setData(graphData);
|
||||
plot_week.draw();
|
||||
} else if (graph == "month") {
|
||||
var graphData = plot_month.getData();
|
||||
var index;
|
||||
for(i=0; i<graphData.length; i++){
|
||||
if(graphData[i].label == curr_term){
|
||||
index = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
graphData[index].lines.show = checked;
|
||||
plot_month.setData(graphData);
|
||||
plot_month.draw();
|
||||
}
|
||||
|
||||
// graph, hide curve
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue