coronaindia
Version:
COVID19 India Tracker, predictive analytics and research. Built by engineers, data scientists, AI and medical professionals.
641 lines (579 loc) • 24.8 kB
HTML
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!--Bootstrap -->
<link href="media/bootstrap/bootstrap-4.3.1/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<!--Bootstrap -->
<!-- <link rel="stylesheet" type="text/css" href="https://www.highcharts.com/media/com_demo/css/highslide.css" /> -->
<link rel="stylesheet" type="text/css" href="media/misc/css/researchGate.css">
<link href="https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@900&display=swap" rel="stylesheet">
</head>
<body>
<div class="container research">
<div class="row">
<div class="col-7">
<a href="/coronaindia"><h4 class="headingCss">CORONA INDIA</h4></a>
</div>
<div class="col-5 text-right" style="font-size: 14px;">
<a href="/coronaindia"><span>< Back to the dashboard</span></a>
</div>
</div>
<div class="row sm-center" style="min-height: 217px;">
<div class="col-12 col-md-4 d-none d-md-block">
<img src="revolution.png" class="rightRotatingImg rotateImg" />
<h6 class="rightRotatingImgText">Predictive <br /> Analysis</h6>
</div>
<div class="col-12 col-md-4 d-none d-md-block">
<img src="revolution.png" class="rightRotatingImg rotateImg" />
<h6 class="rightRotatingImgText">Neural <br /> Networks </h6>
</div>
<div class="col-12 col-md-4">
<img src="revolution.png" class="rightRotatingImg rotateImg" />
<h6 class="rightRotatingImgText">Artificial <br /> Intelligence</h6>
</div>
</div>
<div class="row">
<div class="col-12 ">
<figure class="highcharts-figure">
<div id="container" style="border-right: 1px black;" class="chartContainer">
<div id="loading1" class="waiting">
<img src="loading.gif"></img>
</div>
</div>
<p class="highcharts-description">
Chart showing data loaded dynamically. The individual data points can be clicked to display more
information.
</p>
</figure>
</div>
<div class="col-12 ">
<figure class="highcharts-figure">
<div id="container2" class="chartContainer">
<div id="loading2" class="waiting">
<img src="loading.gif"></img>
</div>
</div>
<p class="highcharts-description">
Chart showing data loaded dynamically. The individual data points can be clicked to display more
information.
</p>
</figure>
</div>
</div>
<br>
<div class="row">
<div class="col-12">
<figure class="highcharts-figure">
<div id="container3" class="chartContainer">
<div id="loading3" class="waiting">
<img src="loading.gif"></img>
</div>
</div>
<p class="highcharts-description">
Chart showing data loaded dynamically. The individual data points can be clicked to display more
information.
</p>
</figure>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-header bg-primary text-white">
Neural Intelligence Based Answer Machine
</div>
<div class="card-body">
<div class="row ml-2 mr-2">
<div class=" col-8">
<input type="text" class="form-control form-control-lg" id="question" placeholder="Enter Question"
name="question">
</div>
<div class="col-3">
<button type="button" class='btn btn-danger btn-lg' onclick="searchAnswer()">Search</button>
</div>
</div>
<div class="col-12">
<div class="direct-chat-messages customScrollBar" id="answerScroll">
<div class="container">
<div id="loading"
style="display:none; text-align: center; position: absolute; right: 0; left: 0; top: 50%; ">
<img src="loading.gif"></img>
</div>
<br><br>
<div id="aboutAnswerContent" class="mr-2" style='text-align:left;font-weight: 600;'>
<p class="text-justify">
It uses state-of-the-art neural intelligence (AI)
network models for answering questions using the <a href="https://pages.semanticscholar.org/coronavirus-research" target="_blank">COVID
Open Research Dataset (CORD-19)</a> provided by the Allen
Institute for AI.
Currently containing more than 47,000 scholarly publications,
including more than 36,000 full-text publications,
on COVID-19 and coronavirus-related studies, from a variety of sources
including PubMed, a curated list of papers from the WHO,
as well as bioRxiv and medRxiv preprints.
</p>
Try some of the example questions below:
<ol id="questionList">
<li>What is the incubation period of COVID-19?</li>
<li>What's the effectiveness of chloroquine for COVID-19?</li>
<li>Are there cases of asymptomatic transmission of COVID-19?</li>
<li>How do weather conditions affect the transmission of COVID-19?</li>
<li>Tell me about IgG and IgM tests for covid-19.</li>
<li>What is the prognostic value of IL-6 levels in covid-19?</li>
</ol>
</div>
<div class="row justify-content-center text-center" id="answerFeed">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal" id="questionModal" tabindex="-1" role="dialog">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="questionTitle">Modal title</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<h5>Authors</h5>
<div id="authors"></div>
<br/>
<h5>Abstract</h5>
<p class="text-justify" id="abstract"></p>
<br/>
<h5>Full-Text Excerpt</h5>
<div class="text-justify" id="paragraphs"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/data.js"></script>
<script src="https://code.highcharts.com/modules/series-label.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>
<script src="https://code.highcharts.com/modules/export-data.js"></script>
<script src="https://code.highcharts.com/modules/accessibility.js"></script>
<script src="media/bootstrap/bootstrap-4.3.1/js/bootstrap.min.js" type="text/javascript"></script>
<!-- <script src="media/misc/js/researchGate.js" /> -->
<!-- Additional files for the Highslide popup effect -->
<!-- <script src="https://www.highcharts.com/media/com_demo/js/highslide-full.min.js"></script>
<script src="https://www.highcharts.com/media/com_demo/js/highslide.config.js" charset="utf-8"></script> -->
<script>
function cases(actual_arr, predict_arr, date_arr) {
Highcharts.chart('container', {
chart: {
type: 'line'
},
title: {
text: 'Corona Cases Prediction'
},
xAxis: {
categories: date_arr
},
yAxis: {
title: {
text: 'Number of Cases'
}
},
series: [{
name: 'Prediction',
data: predict_arr
}, {
name: 'Actual',
data: actual_arr
},],
});
}
function cured(actual_arr, predict_arr, date_arr) {
Highcharts.chart('container2', {
chart: {
type: 'line'
},
title: {
text: 'Cured Patients Prediction'
},
xAxis: {
categories: date_arr
},
yAxis: {
title: {
text: 'Patients Cured'
}
},
series: [{
name: 'Prediction',
data: predict_arr
}, {
name: 'Actual',
data: actual_arr
},],
});
}
function deaths(actual_arr, predict_arr, date_arr) {
Highcharts.chart('container3', {
chart: {
type: 'line'
},
title: {
text: 'Corona Deaths Prediction'
},
xAxis: {
categories: date_arr
},
yAxis: {
title: {
text: 'Number of Death'
}
},
series: [{
name: 'Prediction',
data: predict_arr
}, {
name: 'Actual',
data: actual_arr
},],
});
}
$(document).ready(function () {
console.log("now running");
var myurl = 'https://www.menggabungkanpdf.id/get_prediction.php';
$.ajax({
type: "get",
url: myurl,
dataType: 'json',
success: function (results) {
results = JSON.parse(results.response);
console.log("results are", results);
$(".waiting").hide();
cases(results["cases"]["actual"], results["cases"]["predict"], results["cases"]["date"]);
cured(results["cured"]["actual"], results["cured"]["predict"], results["cured"]["date"]);
deaths(results["deaths"]["actual"], results["deaths"]["predict"], results["deaths"]["date"]);
},
error: function (request, error) {
console.log("There is an error. " + error);
},
});
$("#questionList li").on("click", function () {
var question = $(this).html();
$("#question").val(question);
searchAnswer();
})
// $('#aboutSlider').carousel({
// interval: 2000
// })
});
/*automatic question start here*/
var questionData = [];
function searchAnswer() {
console.log("calling search answer")
var question = document.getElementById("question");
if ($.trim(question.value) == "") {
alert("Please enter your question");
$(question).focus();
("#answerFeed").hide();
$("#aboutAnswerContent").show();
return;
}
console.log("question in ", question.value);
$("#answerFeed").hide();
$("#aboutAnswerContent").hide();
$("#loading").show();
var myurl = 'https://www.menggabungkanpdf.id/faq1.php?query=' + encodeURI(question.value);
console.log("url is", myurl);
$.ajax({
type: "GET",
url: myurl,
dataType: "json",
success: function (results) {
console.log("response", results);
questionData = results.response;
results = results.response;
for (data in results) {
var abstractedText = getHighlightedText(results[data]);
var title = results[data].title;
console.log("data is", results[data]);
console.log("title", title);
//console.log(date);
$('#answerFeed').append("<div class='card mr-2 ml-2' style='width: 80rem;'><h6 class='card-title'><br><b>" + title + "</b></h6><div class='card-body'><p class='text-justify'>" + abstractedText + "</p><button type='button' onclick=\"openAllDetails('" + data + "')\" class='btn btn-dark text-center' target='_blank'>Read More</button></div></div> ");
}
$("#answerFeed").unhighlight();
var questArray = tokenize(question.value);
for (var i = 0; i < questArray.length; i++) {
$("#answerFeed").highlight(questArray[i]);
console.log("tokens are", questArray);
}
$("#loading").hide();
$("#answerFeed").show();
},
error: function (results) {
console.log("There is an error in newsapi. " + results.stringfy);
},
});
}
function getHighlightedText(data) {
console.log("data", data);
var isHighlight = data['highlighted_abstract'];
var highlightAbs = null; data["highlights"][0];
var highlightPara = null;
var abstractedText = "";
if (isHighlight) {
highlightAbs = data["highlights"][0];
highlightPara = data["highlights"][1];
}
else {
highlightPara = data["highlights"][0];
}
if (isHighlight) {
for (var i = 0; i < highlightAbs.length; i++) {
var temphighlight = highlightAbs[i];
console.log("highlights are", temphighlight);
console.log("inside abs");
//console.log("complete text",data.abstract)
console.log("temphighlight[0]", temphighlight[0]);
console.log("temphighlight[0]", temphighlight[1]);
abstractedText += "..." + data.abstract.substring(temphighlight[0], temphighlight[1]);
}
}
if (typeof highlightPara != 'undefined') {
for (var i = 0; i < highlightPara.length; i++) {
var temphighlight = highlightPara[i];
if (typeof data.paragraphs[i] != 'undefined') {
console.log("highlights are", temphighlight);
console.log("complete text", data.paragraphs[i]);
//console.log("data should be",data.paragraphs[i].substring(temphighlight[0],temphighlight[1]));
abstractedText += "..." + data.paragraphs[i].substring(temphighlight[0], temphighlight[1]);
}
else {
abstractedText += "..." + data.paragraphs[i - 1].substring(temphighlight[0], temphighlight[1]);
}
}
}
return abstractedText;
}
function getHighlightedTextArray(data) {
console.log("data", data);
var isHighlight = data['highlighted_abstract'];
var highlightAbs = null; data["highlights"][0];
var highlightPara = null;
var abstractedText = [];
if (isHighlight) {
highlightAbs = data["highlights"][0];
highlightPara = data["highlights"][1];
}
else {
highlightPara = data["highlights"][0];
}
if (isHighlight) {
for (var i = 0; i < highlightAbs.length; i++) {
var temphighlight = highlightAbs[i];
abstractedText.push(data.abstract.substring(temphighlight[0], temphighlight[1]));
}
}
if (typeof highlightPara != 'undefined') {
for (var i = 0; i < highlightPara.length; i++) {
var temphighlight = highlightPara[i];
if (typeof data.paragraphs[i] != 'undefined') {
abstractedText.push(data.paragraphs[i].substring(temphighlight[0], temphighlight[1]));
}
else {
abstractedText.push(data.paragraphs[i - 1].substring(temphighlight[0], temphighlight[1]));
}
}
}
return abstractedText;
}
function openAllDetails(index) {
var question = document.getElementById("question").value;
var data = questionData[index];
var abstractedTextArr = getHighlightedTextArray(data);
var authors = data.authors;
var title = data.title;
var abstract = data.abstract;
var paragraphs = data.paragraphs;
var url = data.url;
var authHtml = "";
var paragraphHtml = "";
for (var i = 0; i < authors.length; i++) {
authHtml += " <span class='badge badge-danger'>" + authors[i] + "</span>";
}
for (var i = 0; i < paragraphs.length; i++) {
paragraphHtml += "<p class='text-justify'>" + paragraphs[i] + "</p>";
}
paragraphHtml += "Read complete <a href='" + url + "' target='_blank'>here</a>";
$("#questionTitle").html(title);
$("#authors").html(authHtml);
$("#abstract").html(abstract);
$("#paragraphs").html(paragraphHtml);
for (var i = 0; i < abstractedTextArr.length; i++) {
$("#questionModal").highlight(abstractedTextArr[i]);
}
var questArray = tokenize(question);
$("#questionModal").unhighlight();
for (var i = 0; i < questArray.length; i++) {
$("#questionModal").highlight(questArray[i]);
}
$("#questionModal").modal("show");
}
function tokenize(text) {
var results = [];
var words = text
.toLowerCase()
.replace('-', ' ')
.replace('.', ' ')
.replace(',', ' ')
.replace('?', ' ')
.split(' ');
words.forEach((word) => {
if (!GRAM_WORDS.includes(word)) {
results.push(word);
}
});
return results;
}
//highlight script
jQuery.extend({ highlight: function (e, t, n, i) { if (3 === e.nodeType) { var r = e.data.match(t); if (r) { var a = document.createElement(n || "span"); a.className = i || "highlight"; var h = e.splitText(r.index); h.splitText(r[0].length); var s = h.cloneNode(!0); return a.appendChild(s), h.parentNode.replaceChild(a, h), 1 } } else if (1 === e.nodeType && e.childNodes && !/(script|style)/i.test(e.tagName) && (e.tagName !== n.toUpperCase() || e.className !== i)) for (var l = 0; l < e.childNodes.length; l++)l += jQuery.highlight(e.childNodes[l], t, n, i); return 0 } }), jQuery.fn.unhighlight = function (e) { var t = { className: "highlight", element: "span" }; return jQuery.extend(t, e), this.find(t.element + "." + t.className).each(function () { var e = this.parentNode; e.replaceChild(this.firstChild, this), e.normalize() }).end() }, jQuery.fn.highlight = function (e, t) { var n = { className: "highlight", element: "span", caseSensitive: !1, wordsOnly: !1 }; if (jQuery.extend(n, t), e.constructor === String && (e = [e]), e = jQuery.grep(e, function (e, t) { return "" != e }), 0 == (e = jQuery.map(e, function (e, t) { return e.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&") })).length) return this; var i = n.caseSensitive ? "" : "i", r = "(" + e.join("|") + ")"; n.wordsOnly && (r = "\\b" + r + "\\b"); var a = new RegExp(r, i); return this.each(function () { jQuery.highlight(this, a, n.element, n.className) }) };
//GRAMMER WORDS
var GRAM_WORDS = [
'i',
'me',
'my',
'myself',
'we',
'our',
'ours',
'ourselves',
'you',
'your',
'yours',
'yourself',
'yourselves',
'he',
'him',
'his',
'himself',
'she',
'her',
'hers',
'herself',
'it',
'its',
'itself',
'they',
'them',
'their',
'theirs',
'themselves',
'what',
'which',
'who',
'whom',
'this',
'that',
'these',
'those',
'am',
'is',
'are',
'was',
'were',
'be',
'been',
'being',
'have',
'has',
'had',
'having',
'do',
'does',
'did',
'doing',
'a',
'an',
'the',
'and',
'but',
'if',
'or',
'because',
'as',
'until',
'while',
'of',
'at',
'by',
'for',
'with',
'about',
'against',
'between',
'into',
'through',
'during',
'before',
'after',
'above',
'below',
'to',
'from',
'up',
'down',
'in',
'out',
'on',
'off',
'over',
'under',
'again',
'further',
'then',
'once',
'here',
'there',
'when',
'where',
'why',
'how',
'all',
'any',
'both',
'each',
'few',
'more',
'most',
'other',
'some',
'such',
'no',
'nor',
'not',
'only',
'own',
'same',
'so',
'than',
'too',
'very',
's',
't',
'can',
'will',
'just',
'don',
'should',
'now',
];
/*automatic question ends here*/
</script>
</body>
</html>