Implement graphs properly
parent
d40557bbba
commit
4b4b8bfe72
GPG Key ID:
5ACFCEED46C0904F
@ -0,0 +1,34 @@
|
||||
function loadJson(selector) {
|
||||
return JSON.parse(document.querySelector(selector).getAttribute('data-json'));
|
||||
}
|
||||
|
||||
|
||||
var jsonData = loadJson('#jsonData');
|
||||
var data = jsonData.map((item) => item.value);
|
||||
var labels = jsonData.map((item) => item.date);
|
||||
|
||||
var config = {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: labels,
|
||||
datasets: [
|
||||
{
|
||||
label: 'Sentiment',
|
||||
backgroundColor: 'black',
|
||||
borderColor: 'lightblue',
|
||||
data: data,
|
||||
fill: false
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
|
||||
}
|
||||
}
|
||||
var element = document.getElementById('volume');
|
||||
element.removeAttribute("height");
|
||||
element.removeAttribute("width");
|
||||
|
||||
var ctx = document.getElementById('volume').getContext('2d');
|
||||
new Chart(ctx, config);
|
||||
@ -0,0 +1,182 @@
|
||||
{% extends "base.html" %}
|
||||
{% load static %}
|
||||
{% block content %}
|
||||
<div class="box">
|
||||
<form method="POST">
|
||||
{% csrf_token %}
|
||||
<div class="field">
|
||||
<label class="label">Search</label>
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
<div class="control is-expanded has-icons-left">
|
||||
<input name="query" class="input" type="text" placeholder="Query">
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-magnifying-glass"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<label class="label">Timescale</label>
|
||||
<div class="field-body">
|
||||
<div class="field">
|
||||
<div class="control is-expanded has-icons-left">
|
||||
<div class="select is-fullwidth">
|
||||
<select name="timescale">
|
||||
{% for timescale in timescales %}
|
||||
<option value="{{ timescale }}">{{ timescale }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-magnifying-glass"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<label class="label">Fields</label>
|
||||
|
||||
<div class="field">
|
||||
<div class="control is-expanded has-icons-left">
|
||||
<div class="select is-fullwidth is-multiple">
|
||||
<select multiple name="fields">
|
||||
{% for field in fields %}
|
||||
<option value="{{ field }}">{{ field }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-magnifying-glass"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<label class="label">Results</label>
|
||||
<div class="field">
|
||||
<div class="control is-expanded has-icons-left">
|
||||
<div class="select is-fullwidth">
|
||||
<select name="size">
|
||||
{% for size in sizes %}
|
||||
<option value="{{ size }}">{{ size }}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<span class="icon is-small is-left">
|
||||
<i class="fas fa-magnifying-glass"></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<div class="control">
|
||||
<button class="button is-primary is-fullwidth">
|
||||
Search
|
||||
</button>
|
||||
<button hx-post="{% url 'search' %}"
|
||||
hx-trigger="click"
|
||||
hx-target="#parent-div"
|
||||
hx-swap="outerHTML">
|
||||
Click Me!
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
{% if results is not None %}
|
||||
<div class="box">
|
||||
<div class="table-container">
|
||||
<table class="table is-striped is-hoverable is-fullwidth">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>TS</th>
|
||||
<th>msg</th>
|
||||
<th>host</th>
|
||||
<th>nick</th>
|
||||
<th>channel</th>
|
||||
<th>net</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
{% for item in results %}
|
||||
<tr>
|
||||
<td>{{ item.ts }}</td>
|
||||
<td>{{ item.msg }}</td>
|
||||
<td>{{ item.host }}</td>
|
||||
<td>{{ item.nick }}</td>
|
||||
<td>{{ item.channel }}</td>
|
||||
<td>{{ item.net }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<p>{{ card }} hits</p>
|
||||
</div>
|
||||
{% if redacted != 0 %}
|
||||
<div class="column">
|
||||
<p>{{ redacted }} redacted</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if exemption is not None %}
|
||||
<div class="column">
|
||||
<p>god mode</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="column">
|
||||
<p>{{ took }}ms</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="columns">
|
||||
<div class="column is-half">
|
||||
<div class="box">
|
||||
<label class="label">Volume</label>
|
||||
<canvas id="volumeChart"></canvas>
|
||||
|
||||
<script type="text/javascript">
|
||||
$.post('{% url "chart_volume_json" %}', function(data) {
|
||||
var ctx = $("#volumeChart").get(0).getContext("2d");
|
||||
new Chart(ctx, {
|
||||
type: 'line', data: data
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="column">
|
||||
<div class="box">
|
||||
<label class="label">Sentiment</label>
|
||||
<canvas id="sentimentChart"></canvas>
|
||||
<script type="text/javascript">
|
||||
$.post('{% url "chart_sentiment_json" %}', function(data) {
|
||||
var ctx = $("#sentimentChart").get(0).getContext("2d");
|
||||
new Chart(ctx, {
|
||||
type: 'line', data: data
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endif %}
|
||||
|
||||
{% endblock %}
|
||||
@ -0,0 +1,11 @@
|
||||
{% load static %}
|
||||
<html>
|
||||
<head>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,66 @@
|
||||
{% load static %}
|
||||
|
||||
<div id="results">
|
||||
{% if results is not None %}
|
||||
<div style="display: none" id="jsonData" data-json="{{ data }}"></div>
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<div class="box">
|
||||
<label class="label">Sentiment</label>
|
||||
<canvas id="volume"></canvas>
|
||||
<script src="{% static 'chart.js' %}"></script>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<div class="table-container">
|
||||
<table class="table is-striped is-hoverable is-fullwidth">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>TS</th>
|
||||
<th>msg</th>
|
||||
<th>host</th>
|
||||
<th>nick</th>
|
||||
<th>channel</th>
|
||||
<th>net</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
<tbody>
|
||||
{% for item in results %}
|
||||
<tr>
|
||||
<td>{{ item.ts }}</td>
|
||||
<td>{{ item.msg }}</td>
|
||||
<td>{{ item.host }}</td>
|
||||
<td>{{ item.nick }}</td>
|
||||
<td>{{ item.channel }}</td>
|
||||
<td>{{ item.net }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div class="box">
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<p>{{ card }} hits</p>
|
||||
</div>
|
||||
{% if redacted != 0 %}
|
||||
<div class="column">
|
||||
<p>{{ redacted }} redacted</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% if exemption is not None %}
|
||||
<div class="column">
|
||||
<p>god mode</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div class="column">
|
||||
<p>{{ took }}ms</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
@ -1,71 +0,0 @@
|
||||
from chartjs.views.lines import BaseLineChartView
|
||||
from django.contrib.auth.mixins import LoginRequiredMixin
|
||||
from django.utils.decorators import method_decorator
|
||||
from django.views.decorators.csrf import csrf_exempt
|
||||
|
||||
|
||||
class CSRFExemptMixin(object):
|
||||
@method_decorator(csrf_exempt)
|
||||
def dispatch(self, *args, **kwargs):
|
||||
return super(CSRFExemptMixin, self).dispatch(*args, **kwargs)
|
||||
|
||||
|
||||
class VolumeChartJSONView(CSRFExemptMixin, LoginRequiredMixin, BaseLineChartView):
|
||||
def post(self, request, *args, **kwargs):
|
||||
print("POST")
|
||||
context = self.get_context_data(**kwargs)
|
||||
return self.render_to_response(context)
|
||||
|
||||
def get_context_data(self, **kwargs):
|
||||
data = super(VolumeChartJSONView, self).get_context_data(**kwargs)
|
||||
# data["colors"] = islice(next_color(), 0, 50)
|
||||
print("KWARGS", kwargs)
|
||||
return data
|
||||
|
||||
def get_labels(self):
|
||||
"""Return 7 labels for the x-axis."""
|
||||
return ["January", "February", "March", "April", "May", "June", "July"]
|
||||
|
||||
def get_providers(self):
|
||||
"""Return names of datasets."""
|
||||
return ["Central", "Eastside", "Westside"]
|
||||
|
||||
def get_data(self):
|
||||
"""Return 3 datasets to plot."""
|
||||
|
||||
return [
|
||||
[75, 44, 92, 11, 44, 95, 35],
|
||||
[41, 92, 18, 3, 73, 87, 92],
|
||||
[87, 21, 94, 3, 90, 13, 65],
|
||||
]
|
||||
|
||||
|
||||
class SentimentChartJSONView(CSRFExemptMixin, LoginRequiredMixin, BaseLineChartView):
|
||||
def post(self, request, *args, **kwargs):
|
||||
print("POST")
|
||||
print(request.POST)
|
||||
context = self.get_context_data(**kwargs)
|
||||
return self.render_to_response(context)
|
||||
|
||||
def get_context_data(self, **kwargs):
|
||||
data = super(SentimentChartJSONView, self).get_context_data(**kwargs)
|
||||
# data["colors"] = islice(next_color(), 0, 50)
|
||||
print("KWARGS", kwargs)
|
||||
return data
|
||||
|
||||
def get_labels(self):
|
||||
"""Return 7 labels for the x-axis."""
|
||||
return ["January", "February", "March", "April", "May", "June", "July"]
|
||||
|
||||
def get_providers(self):
|
||||
"""Return names of datasets."""
|
||||
return ["Central", "Eastside", "Westside"]
|
||||
|
||||
def get_data(self):
|
||||
"""Return 3 datasets to plot."""
|
||||
|
||||
return [
|
||||
[75, 44, 92, 11, 44, 95, 35],
|
||||
[41, 92, 18, 3, 73, 87, 92],
|
||||
[87, 21, 94, 3, 90, 13, 65],
|
||||
]
|
||||
@ -0,0 +1,86 @@
|
||||
from rest_framework.views import APIView
|
||||
import logging
|
||||
from django.conf import settings
|
||||
from django.shortcuts import render
|
||||
from django.http import HttpResponse, JsonResponse
|
||||
from django.contrib.auth.mixins import LoginRequiredMixin
|
||||
import json
|
||||
from django.views.decorators.csrf import csrf_exempt
|
||||
from django.views import View
|
||||
from rest_framework.parsers import JSONParser
|
||||
from core.lib.opensearch import initialise_opensearch, run_main_query
|
||||
client = initialise_opensearch()
|
||||
|
||||
|
||||
def query_results(request, post_params, api=False):
|
||||
fields = None
|
||||
if "fields" in request.POST:
|
||||
fields = request.POST.getlist("fields")
|
||||
if "size" in request.POST:
|
||||
size = request.POST["size"]
|
||||
if "query" in request.POST:
|
||||
query = request.POST["query"]
|
||||
results = run_main_query(client, request.user, query, fields, size)
|
||||
if not results:
|
||||
return False
|
||||
# pp.pprint(results)
|
||||
results_parsed = []
|
||||
if "hits" in results.keys():
|
||||
if "hits" in results["hits"]:
|
||||
for item in results["hits"]["hits"]:
|
||||
results_parsed.append(item["_source"])
|
||||
context = {
|
||||
"query": query,
|
||||
"results": results_parsed,
|
||||
"card": results["hits"]["total"]["value"],
|
||||
"took": results["took"],
|
||||
"redacted": results["redacted"],
|
||||
"exemption": results["exemption"],
|
||||
"fields": settings.OPENSEARCH_MAIN_SEARCH_FIELDS,
|
||||
"sizes": settings.OPENSEARCH_MAIN_SIZES,
|
||||
"timescales": settings.OPENSEARCH_MAIN_TIMESCALES,
|
||||
}
|
||||
return context
|
||||
|
||||
class Search(LoginRequiredMixin, View):
|
||||
#parser_classes = [JSONParser]
|
||||
template_name = "ui/results.html"
|
||||
plan_name = "drilldown"
|
||||
|
||||
def post(self, request):
|
||||
if not request.user.has_plan(self.plan_name):
|
||||
return render(request, "denied.html")
|
||||
|
||||
context = query_results(request, request.POST)
|
||||
print("context: ", context)
|
||||
context['data'] = json.dumps(
|
||||
[
|
||||
{
|
||||
'id': item.get('id'),
|
||||
'value': item.get("sentiment", 0),
|
||||
'date': item.get("ts"),
|
||||
}
|
||||
for item in context["results"]
|
||||
]
|
||||
)
|
||||
print("context['data']: ", context['data'])
|
||||
if context:
|
||||
print("OGING TO RENDER")
|
||||
return render(request, self.template_name, context)
|
||||
else:
|
||||
return HttpResponse("No results")
|
||||
|
||||
class APISearch(LoginRequiredMixin, View):
|
||||
#parser_classes = [JSONParser]
|
||||
template_name = "ui/results.html"
|
||||
plan_name = "drilldown"
|
||||
|
||||
def post(self, request):
|
||||
print("POST")
|
||||
if not request.user.has_plan(self.plan_name):
|
||||
return JsonResponse({"success": False})
|
||||
print("PERMS")
|
||||
|
||||
context = query_results(request, request.POST)
|
||||
print("CONTEXT", context)
|
||||
return JsonResponse(context)
|
||||
Loading…
Reference in New Issue