302 lines
10 KiB
JavaScript
302 lines
10 KiB
JavaScript
$(function () {
|
|
|
|
var currentUrl = window.location;
|
|
let searchParams = new URLSearchParams(currentUrl.search);
|
|
let paramSearch = searchParams.get('search')
|
|
|
|
queryUrl = 'http://localhost:8983/solr/imdb/select?facet.field=genres&facet=on&hl.fl=primaryTitle&hl=on&'
|
|
|
|
// if (paramSearch === '') {
|
|
// httpGet(queryUrl + "q=*:*")
|
|
// }
|
|
// else {
|
|
// httpGet(queryUrl + "q=primaryTitle:\"" + paramSearch.replace('+', ' ') + "\"")
|
|
// }
|
|
|
|
var queryParams = {}
|
|
queryParams.primaryTitle = paramSearch
|
|
queryParams.rows = 50
|
|
queryParams.start = 0
|
|
queryParams.selectedPage = 1
|
|
queryParams.genres = new Set()
|
|
|
|
$('#search-title').keypress(function (e) {
|
|
if (e.which === 13) {
|
|
queryParams.primaryTitle = $('#search-title').val()
|
|
queryParams.selectedPage = 1
|
|
refresh()
|
|
}
|
|
});
|
|
|
|
$('body').on('click', '.genres-cat', function () {
|
|
queryParams.genres.add($(this).text().replace(': ', ''))
|
|
queryParams.selectedPage = 1
|
|
refresh()
|
|
});
|
|
|
|
$('body').on('click', '.genres-filter', function () {
|
|
queryParams.genres.delete($(this).text())
|
|
queryParams.selectedPage = 1
|
|
refresh()
|
|
});
|
|
|
|
$('body').on('click', '.page-item', function () {
|
|
el = $(this)
|
|
if (!el.hasClass('active') && !el.hasClass('disabled')) {
|
|
queryParams.selectedPage = parseInt(el.find('a').text())
|
|
refresh()
|
|
}
|
|
});
|
|
|
|
refresh()
|
|
|
|
function refresh() {
|
|
getUrl = queryUrl
|
|
if (queryParams.primaryTitle && queryParams.primaryTitle !== '') {
|
|
getUrl += 'q=(primaryTitle:' + queryParams.primaryTitle + ')'
|
|
$('#search-title').val(queryParams.primaryTitle)
|
|
}
|
|
else {
|
|
getUrl += 'q=primaryTitle:' + '*'
|
|
$('#search-title').val('')
|
|
}
|
|
|
|
if (queryParams.genres.size > 0) {
|
|
queryParams.genres.forEach(element => {
|
|
getUrl += ' AND genres:' + element
|
|
})
|
|
}
|
|
|
|
startEl = (queryParams.selectedPage -1) * queryParams.rows
|
|
|
|
getUrl += '&rows=' + queryParams.rows
|
|
getUrl += '&start=' + startEl
|
|
|
|
httpGet(getUrl)
|
|
}
|
|
|
|
function httpGet(url) {
|
|
let xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState == 4 && this.status == 200) {
|
|
fillEntries(xhttp.responseText)
|
|
}
|
|
};
|
|
xhttp.open("GET", url, true);
|
|
xhttp.setRequestHeader("Content-type", "application/json");
|
|
xhttp.send();
|
|
}
|
|
|
|
function getStarRating(ratingValue) {
|
|
let html = '<div>'
|
|
ratingValue = ratingValue / 2
|
|
for (let i = 0; i < 5; i++) {
|
|
let rating = ratingValue - i
|
|
if (rating < 0) {
|
|
html += '<i class="bi bi-star"></i>'
|
|
}
|
|
else if (rating < 0.5) {
|
|
html += '<i class="bi bi-star-half"></i>'
|
|
}
|
|
else {
|
|
html += '<i class="bi bi-star-fill"></i>'
|
|
}
|
|
}
|
|
html = html + '</div>'
|
|
return html;
|
|
}
|
|
|
|
function drawPagination(elNum) {
|
|
|
|
pgNum = Math.ceil(1.0 * elNum / queryParams.rows)
|
|
|
|
let paginationEl = $('.pagination')
|
|
paginationEl.empty()
|
|
|
|
html = ''
|
|
if (pgNum > 9) {
|
|
if (queryParams.selectedPage > 3 && queryParams.selectedPage < pgNum - 2) {
|
|
for (let i = 0; i < 3; i++) {
|
|
if (i + 1 == queryParams.selectedPage) {
|
|
html += '<li class="page-item active"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
else {
|
|
html += '<li class="page-item"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
}
|
|
html += '<li class="page-item disabled"><a class="page-link" >...</a></li>'
|
|
for (let i = queryParams.selectedPage - 2; i < queryParams.selectedPage + 1; i++) {
|
|
if (i + 1 == queryParams.selectedPage) {
|
|
html += '<li class="page-item active"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
else {
|
|
html += '<li class="page-item"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
}
|
|
html += '<li class="page-item disabled"><a class="page-link" >...</a></li>'
|
|
for (let i = pgNum - 3; i < pgNum; i++) {
|
|
if (i + 1 == queryParams.selectedPage) {
|
|
html += '<li class="page-item active"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
else {
|
|
html += '<li class="page-item"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
}
|
|
}
|
|
else {
|
|
for (let i = 0; i < 4; i++) {
|
|
if (i + 1 == queryParams.selectedPage) {
|
|
html += '<li class="page-item active"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
else {
|
|
html += '<li class="page-item"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
}
|
|
html += '<li class="page-item disabled"><a class="page-link" >...</a></li>'
|
|
for (let i = pgNum - 4; i < pgNum; i++) {
|
|
if (i + 1 == queryParams.selectedPage) {
|
|
html += '<li class="page-item active"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
else {
|
|
html += '<li class="page-item"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
}
|
|
}
|
|
}
|
|
if (pgNum > 0 && pgNum < 10) {
|
|
for (let i = 0; i < pgNum; i++) {
|
|
if (i + 1 == queryParams.selectedPage) {
|
|
html += '<li class="page-item active"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
else {
|
|
html += '<li class="page-item"><a class="page-link" >' + (i + 1).toString() + '</a></li>'
|
|
}
|
|
}
|
|
}
|
|
|
|
paginationEl.html(html)
|
|
}
|
|
|
|
function fillEntries(json) {
|
|
|
|
const responseObject = JSON.parse(json);
|
|
|
|
//var template = document.getElementById("entry-template");
|
|
|
|
let template = $('<div>' + $('#entry-template').html() + '</div>')
|
|
|
|
//let entries = document.getElementById("entry-list")
|
|
let entries = $('#entry-list')
|
|
|
|
entries.empty()
|
|
|
|
entries.innerHTML = ''
|
|
|
|
let first = true
|
|
|
|
$('#number-of-entries').text(responseObject.response.numFound)
|
|
|
|
|
|
responseObject.response.docs.forEach(element => {
|
|
$.get('http://localhost:8983/solr/imdb_ratings/select?q=tconst:' + element.tconst[0], function (data) {
|
|
if (first == false) {
|
|
entries.append('<hr>')
|
|
}
|
|
if (responseObject.highlighting[element.id].primaryTitle) {
|
|
template.find('.primary-title').html(responseObject.highlighting[element.id].primaryTitle[0])
|
|
}
|
|
else {
|
|
template.find('.primary-title').text(element.primaryTitle[0])
|
|
}
|
|
template.find('.original-title').text(element.originalTitle[0])
|
|
if (data.response.numFound == 1) {
|
|
template.find('.rating-val').html(getStarRating(data.response.docs[0].averageRating))
|
|
}
|
|
else {
|
|
template.find('.rating-val').empty()
|
|
}
|
|
template.find('.val-start-year').text(element.startYear)
|
|
template.find('.val-runtime-minutes').text(element.runtimeMinutes)
|
|
let genres = ''
|
|
element.genres.forEach(element => {
|
|
genres += "<div>" + element + "</div>"
|
|
})
|
|
template.find('.val-genres')[0].innerHTML = genres
|
|
entries.append(template.html())
|
|
first = false
|
|
})
|
|
});
|
|
|
|
|
|
let facets = responseObject.facet_counts.facet_fields.genres
|
|
|
|
let categories = $('#categories')
|
|
categories.empty()
|
|
for (i = 0; i < facets.length; i += 2) {
|
|
if (facets[i + 1] > 0) {
|
|
el = '<div><span class="genres-cat">' + facets[i] + ': </span><span class="genres-val">' + facets[i + 1].toString() + '</span></div>'
|
|
categories.append(el)
|
|
}
|
|
}
|
|
|
|
let filters = $('#filters')
|
|
filters.empty()
|
|
queryParams.genres.forEach(element => {
|
|
el = '<div><span class="genres-filter">' + element + '</span></div>'
|
|
filters.append(el)
|
|
})
|
|
|
|
drawPagination(responseObject.response.numFound)
|
|
}
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
// var currentUrl = window.location;
|
|
// let searchParams = new URLSearchParams(currentUrl.search);
|
|
// let paramSearch = searchParams.get('search')
|
|
|
|
// httpGet("a")
|
|
|
|
// function httpGet(url) {
|
|
// let xhttp = new XMLHttpRequest();
|
|
// xhttp.onreadystatechange = function () {
|
|
// if (this.readyState == 4 && this.status == 200) {
|
|
// fillEntries(xhttp.responseText)
|
|
// }
|
|
// };
|
|
// xhttp.open("GET", "http://localhost:8983/solr/imdb/select?q=*%3A*", true);
|
|
// xhttp.setRequestHeader("Content-type", "application/json");
|
|
// xhttp.send();
|
|
// }
|
|
|
|
// function fillEntries(json) {
|
|
// let url = 'http://localhost:8983/solr/imdb/select';
|
|
|
|
// const responseObject = JSON.parse(json);
|
|
|
|
// var template = document.getElementById("entry-template");
|
|
|
|
// let entries = document.getElementById("entry-list")
|
|
|
|
// entries.innerHTML = ''
|
|
|
|
// let first = true
|
|
|
|
// responseObject.response.docs.forEach(element => {
|
|
// if (first == false) {
|
|
// entries.innerHTML += '<hr>'
|
|
// }
|
|
// let a = template.getElementsByClassName('primary-title')
|
|
// a[0].innerHTML=element.primaryTitle[0]
|
|
// entries.innerHTML += template.innerHTML
|
|
// first = false
|
|
// });
|
|
|
|
|
|
|
|
// }
|