mirror of
https://github.com/th3r00t/pyShelf.git
synced 2026-04-28 01:59:35 -04:00
305 lines
12 KiB
JavaScript
Executable File
305 lines
12 KiB
JavaScript
Executable File
$(document).ready(function(){
|
|
function customlog(outstream) {
|
|
/* Gather my variables and output them */
|
|
for (var i = 0; i < outstream.length; i++){
|
|
console.log(">> "+outstream[i]);
|
|
};
|
|
};
|
|
/* Initialize ui variables */
|
|
let outstream = []; // put customlog messages here
|
|
let win_height = window.innerHeight; // Get the displays height
|
|
let win_width = window.innerWidth; // Get the displays width
|
|
let scr_height = window.outerHeight;
|
|
let scr_width = window.outerWidth;
|
|
let hdr_height = $('.app_hdr').height(); // Get our header height
|
|
let ftr_height = $('.app_footer').height(); // Get our footer height
|
|
let nav_width = $('.nav_l').width(); // Get the width of our nav items
|
|
let cmp_height = window.screen.availHeight;
|
|
let max_height = win_height - (hdr_height + ftr_height) - (scr_height - win_height); // Set our available height
|
|
const u_string = "Username";
|
|
const p_string = "Password";
|
|
const s_string = "search by Title, Author, Tags, or Collections";
|
|
const popover = $('#pop_over_0')
|
|
const navlink = $('.nav_link')
|
|
const inputbox = $('input_box')
|
|
const loginbtn = $('#btn_login')
|
|
const server = ('ws://127.0.0.1:1337')
|
|
customlog([cmp_height]);
|
|
$(".search_submit").click(function(){
|
|
var query = $('.nav_search').val();
|
|
console.log(query);
|
|
window.location.href = '/search/'+query;
|
|
});
|
|
$('.nav_search').on('keypress', function (e) {
|
|
if(e.which === 13){
|
|
$(this).attr("disabled", "disabled");
|
|
var query = $('.nav_search').val();
|
|
window.location.href = '/search/'+query;
|
|
$(this).removeAttr("disabled");
|
|
}
|
|
});
|
|
$(navlink).on('mouseover', function (e){
|
|
var popover_str = $(this).attr('alt');
|
|
x = $(this).offset().left;
|
|
y = $(this).offset().to;
|
|
$('.popover').html(popover_str);
|
|
$('.popover').css('left', x+nav_width);
|
|
$('.popover').css('top', y);
|
|
$('.popover').css('display','flex');
|
|
});
|
|
$(navlink).on('mouseout', function (e){
|
|
var popover_str = $(this).attr('alt');
|
|
x = $(this).offset().left;
|
|
y = $(this).offset().top;
|
|
$('.popover').html(popover_str);
|
|
$('.popover').css('left', x);
|
|
$('.popover').css('top', y);
|
|
$('.popover').css('display','none');
|
|
});
|
|
$('#btn_collections').on('click', function (e){
|
|
$('.hidden.vert-nav.collections').toggle();
|
|
});
|
|
$(inputbox).on('click', function(){
|
|
$(this).attr("value","");
|
|
});
|
|
$(inputbox).focusout(function(){
|
|
if ($(this).hasClass('nav_search') && $(this).val() == "") {
|
|
$(this).attr("value", s_string);
|
|
}
|
|
if ($(this).attr("id") == "username" && $(this).val() == "") {
|
|
$(this).attr("value", u_string);
|
|
}
|
|
if ($(this).attr("id") == "password" && $(this).val() == "") {
|
|
$(this).attr("value", p_string);
|
|
}
|
|
});
|
|
$(loginbtn).on('click', function(){
|
|
$('#hdr_nav_login').toggle();
|
|
})
|
|
$('.favorite_action').on('click', function(){
|
|
$(this).children('a').toggleClass('favorite');
|
|
});
|
|
$('#sortlist').change(function () {
|
|
var optionSelected = $(this).find("option:selected");
|
|
var valueSelected = optionSelected.val();
|
|
var textSelected = optionSelected.text();
|
|
window.location.href="/"+valueSelected;
|
|
});
|
|
$('#btn-home').on("click", function(){
|
|
_location = $(this).attr('data-location');
|
|
window.location.href=_location;
|
|
});
|
|
$('#flip_sort').on("click", function(){
|
|
window.location.href="/flip_sort/"+$("#_order").val();
|
|
});
|
|
$('#search_string').html("<i> "+$('#_search').val().substr(0,15)+"</i>");
|
|
$(popover).dialog({ autoOpen: false });
|
|
$(popover).on('click', 'div.collection', function(){
|
|
window.location.href = '/show_collection/'+$(this).attr('data');
|
|
});
|
|
$(loginbtn).on('click', function() {
|
|
var isopen = $('#pop_over_0').dialog("isOpen");
|
|
if (isopen) {
|
|
$('#pop_over_0').dialog("close");
|
|
return;
|
|
}
|
|
$.ajax({
|
|
type: "GET", url: "/live", data: {hook: 'register'},
|
|
success: function (response) {
|
|
// Set the dialog title
|
|
$('#pop_over_0').dialog({
|
|
title: "User Controls",
|
|
maxHeight: (win_height - 100),
|
|
minWidth: $("#horiz_nav_main").width(),
|
|
hide: {effect: "blind", duration: 1000},
|
|
show: {effect: "blind", duration: 1000},
|
|
position: {
|
|
my: "top", at: "bottom", of: $("#horiz_nav_main")
|
|
}
|
|
});
|
|
// clear and create a new container
|
|
$('#pop_over_0').html('<div id=usercp class="mx-auto">');
|
|
// Populate the container from response.data
|
|
$('#usercp').append('<div class="row" id="usercp-inner">');
|
|
$('#usercp-inner').append(response.data);
|
|
$('#usercp-inner').append('</div>');
|
|
$('#usercp').append('</div>');
|
|
// Close the container
|
|
$('#pop_over').append('</div>');
|
|
// Now open this dialog
|
|
$('#pop_over_0').dialog("open");
|
|
},
|
|
error: function (response) {
|
|
customlog(["Failure", response]);
|
|
}
|
|
});
|
|
});
|
|
$('#btn_logout').on('click', function() {
|
|
//window.location.href = '/logout';
|
|
var isopen = $('#pop_over_0').dialog("isOpen");
|
|
if (isopen) {
|
|
$('#pop_over_0').dialog("close");
|
|
return;
|
|
}
|
|
$('#pop_over_0').dialog({
|
|
title: "User Controls",
|
|
maxHeight: (win_height - 100),
|
|
minWidth: $("#horiz_nav_main").width(),
|
|
hide: {effect: "blind", duration: 1000},
|
|
show: {effect: "blind", duration: 1000},
|
|
position: {
|
|
my: "top", at: "bottom", of: $("#horiz_nav_main")
|
|
}
|
|
});
|
|
// clear and create a new container
|
|
$('#pop_over_0').html('<div id=usercp class="mx-auto">');
|
|
// Populate the container from response.data
|
|
$('#usercp').append('<div class="row" id="usercp-inner">');
|
|
$('#usercp-inner').append(
|
|
'<div class="col-auto" id="usercp-col1">' +
|
|
'<button type="submit" class="btn-sm btn-secondary import-btn"><i class="fas fa-file-import"></i> Import Books</button>' +
|
|
'</div>' +
|
|
'<div class="col-auto" id="usercp-col2">' +
|
|
'<button type="submit" class="btn-sm btn-secondary logout-btn"><i class="fas fa-sign-out-alt"></i> Logout</button>' +
|
|
'</div>'
|
|
);
|
|
$('#usercp-inner').append('</div>');
|
|
$('#usercp').append('</div>');
|
|
// Close the container
|
|
$('#pop_over').append('</div>');
|
|
// Now open this dialog
|
|
$('#pop_over_0').dialog("open");
|
|
});
|
|
$(document).on('click', '.logout-btn', function(){window.location.href = '/logout'});
|
|
$(document).on('click', '.import-btn', function(){
|
|
let socket = PyshelfServer(server);
|
|
ping(socket);
|
|
});
|
|
$('#coll_button').on('click', function(){
|
|
var isopen = $('#pop_over_0').dialog("isOpen");
|
|
if (isopen){
|
|
$('#pop_over_0').dialog("close");
|
|
return;
|
|
}
|
|
customlog(['Collections Clicked']);
|
|
$.ajax({
|
|
type: "GET", url: "/live", data: {hook: 'collection_listing'},
|
|
success: function(response){
|
|
// Set the dialog title
|
|
$('#pop_over_0').dialog({
|
|
title: "Collections",
|
|
maxHeight: (win_height-100),
|
|
minWidth: $("#horiz_nav_main").width(),
|
|
hide: { effect: "blind", duration: 1000 },
|
|
show: { effect: "blind", duration: 1000 },
|
|
position: { my: "top", at: "bottom", of: $("#horiz_nav_main")
|
|
}
|
|
});
|
|
// clear and create a new container
|
|
$('#pop_over_0').html('<div id=collections>');
|
|
// Populate the container from response.data
|
|
$.each(response.data, function(index, value){
|
|
$('#collections').append("<div class=collection data='"+value+"/"+$('#_set').val()+"'>"+value+"</div>");
|
|
});
|
|
// Close the container
|
|
$('#pop_over').append('</div>');
|
|
// Now open this dialog
|
|
$('#pop_over_0').dialog("open");
|
|
},
|
|
error: function(response){
|
|
customlog(["Failure", response]);
|
|
}
|
|
});
|
|
});
|
|
$('.info-button').on('click', function(){
|
|
var isopen = $('#pop_over_0').dialog("isOpen");
|
|
if (isopen){
|
|
$('#pop_over_0').dialog("close");
|
|
return;
|
|
}
|
|
customlog(['Book Details Clicked', $(this).attr('data')]);
|
|
$.ajax({
|
|
type: "GET", url: "/live", data: {hook: 'details', pk:$(this).attr('data')},
|
|
success: function(response){
|
|
// Set the dialog title
|
|
$('#pop_over_0').dialog({
|
|
title: response.data['title'],
|
|
maxHeight: (win_height-100),
|
|
minWidth: $("#horiz_nav_main").width(),
|
|
hide: { effect: "blind", duration: 1000 },
|
|
show: { effect: "blind", duration: 1000 },
|
|
position: { my: "center center", at: "center center", of: window
|
|
}
|
|
});
|
|
// clear and create a new container
|
|
$('#pop_over_0').html('<div id=book_expanded>');
|
|
// Populate the container from response.data
|
|
$('#book_expanded').append('<div class=row><div class="col-auto">Title</div><div class="col-auto text-muted">'+response.data['title']+'</div></div>')
|
|
$('#book_expanded').append('<div class=row><div class="col-auto">Author</div><div class="col-auto text-muted">'+response.data['author']+'</div></div>')
|
|
if (response.data['description']!== null){
|
|
$('#book_expanded').append('<div class=row><div class="col-auto">Expanded Description</div><div class="col-auto text-muted">'+response.data['description']+'</div></div>')
|
|
|
|
}
|
|
if (response.data['tags'] !== null){
|
|
$('#book_expanded').append('<div class=row><div class="col-auto">Tags</div><div class="col-auto text-muted">'+response.data['tags']+'</div></div>')
|
|
}
|
|
// Close the container
|
|
$('#pop_over').append('</div>');
|
|
// Now open this dialog
|
|
$('#pop_over_0').dialog("open");
|
|
},
|
|
error: function(response){
|
|
customlog(["Failure", response]);
|
|
}
|
|
});
|
|
});
|
|
resize_search();
|
|
$(window).resize(resize_search(win_width));
|
|
});
|
|
|
|
function resize_search(win_width){
|
|
if (win_width <= 1025){
|
|
$('.search_string').attr('size', 20);
|
|
$('.search_string').val("Search");
|
|
}
|
|
if (win_width <= 426){
|
|
$('.search_string').attr('size', 10);
|
|
$('.search_string').val("Search");
|
|
}
|
|
}
|
|
|
|
function OpenSocket(address) {
|
|
return new Promise(resolve => {
|
|
const connection = new WebSocket(address);
|
|
connection.onconnect = function(e){
|
|
|
|
ping(connection);
|
|
};
|
|
connection.onmessage = function(rcvd){
|
|
sock_rx(rcvd)
|
|
};
|
|
resolve(connection);
|
|
});
|
|
}
|
|
async function PyshelfServer(address){
|
|
console.log("--[ Starting Connection ]")
|
|
connection = await OpenSocket(address);
|
|
console.log('--[ Connection Established ]')
|
|
return connection
|
|
}
|
|
function sock_rx(rcvd) {
|
|
if (rcvd.data == 'pong') { pong(rcvd.data) }
|
|
else { console.log("<<[rx] :"+rcvd.data) }
|
|
}
|
|
function sock_status(connection) {
|
|
let buffered = connection.bufferedAmmount;
|
|
let ready = connection.readyState;
|
|
return [buffered, ready];
|
|
}
|
|
function ping(connection) {
|
|
connection.send('ping')
|
|
}
|
|
function pong(rcvd) {
|
|
console.log("<<["+rcvd.data+"] "+rcvd.data)
|
|
}
|