$(document).ready(function() { var liveEntryID = $('[id^="activeEntry_"]').attr('id').slice(12); function getEntry(pk) { var entrySpinner = $('#entrySpinner'); $("#entrySpinner").addClass('opacity-50 bg-white'); $("#entrySpinner").append('
Loading...
'); $.ajax({ type: "POST", url: "/play/getEntry/", data: { 'pk': pk, csrfmiddlewaretoken: csrftoken }, success: function(data) { $("#entrySpinner").removeClass('opacity-50 bg-white'); entrySpinner.empty(); // Clear existing content updateEntry(data) updateVotes(data) } }); } // PRELOAD LATEST ENTRY getEntry(liveEntryID) var scheduled_function = false; function entrySearch(search_text, page_number) { if (search_text === '') { var request_parameters = { page: page_number }; } else { var request_parameters = { entries: search_text, page: page_number }; } if (scheduled_function) { clearTimeout(scheduled_function); } scheduled_function = setTimeout(function() { $.ajax({ type: "GET", url: "/play/goblin-AI/", data: request_parameters, success: function(data) { // Handle the response data here console.log(data); // Update the UI with the received entries updateEntryList(data.entries); // Update the pagination links updatePaginationLinks(data.entries); }, error: function(xhr, status, error) { // Handle any error that occurs during the AJAX call console.log(error); } }); }, 700); // Delay by 200ms before making the AJAX call } $("#entry-search").on('keyup', function() { entrySearch(search_text = $(this).val().trim(), 1) }); // Function to update the entry list in the UI function updateEntryList(entries) { // Clear the existing entry list $("#entryContainer").empty(); // Parse the JSON data var parsedEntries = JSON.parse(entries); // Iterate over the parsed entries and append them to the list parsedEntries.forEach(function(entry) { // Append the entry to the entry list $("#entryContainer").append(`
`); }); } // Function to update the pagination links in the UI function updatePaginationLinks(entries) { // Parse the JSON data var parsedEntries = JSON.parse(entries); // Check if there are more pages var hasMorePages = parsedEntries.length > 0; // Enable or disable the pagination links based on the availability of more pages if (hasMorePages) { $(".page-link").removeClass('disabled'); } else { $(".page-link").addClass('disabled'); } } // Function to handle pagination link clicks $(document).on('click', '.page-link:not([aria-label])', function() { var page_number = $(this).data('page'); $(".page-link:not([aria-label])").removeClass('active'); $(this).addClass('active'); var search_text = $("#entry-search").val(); entrySearch(search_text, page_number) }); function updateEntry(data) { var activeEntry = $('[id^="activeEntry_"]'); var updatedID = data.entry.id; var newId = "activeEntry_" + updatedID; activeEntry.attr('id', newId); var entryTitle = $("#entryTitle"); entryTitle.empty(); // Clear existing content $("#entryTitle").append("

" + data.entry.title + "

"); var entryTweets = $("#entryTweets"); entryTweets.empty(); // Clear existing content // Loop through data.tweets and add paragraphs for each tweet for (var i = 0; i < data.tweets.length; i++) { var tweet = data.tweets[i]; entryTweets.append("

" + tweet.text + "

"); } } function updateVotes(data) { var entryOptions = $("#entryOptions"); var deleteContainer = $("#deleteContainer"); entryOptions.empty(); // Clear existing content deleteContainer.empty(); // Clear existing content // Loop through data.options and add li for each option if (!data.entry.live) { var voteCTA = $("#voteCTA"); voteCTA.empty(); // Clear existing content $("#voteCTA").append("

Vote for what he does tomorrow!

"); for (var i = 0; i < data.options.length; i++) { var option = data.options[i]; var checkedAttribute = (option.user_vote === 1) ? 'checked' : ''; // Check if user_vote is 1 entryOptions.append( '' + '' ); } deleteContainer.append(`
`); } else { for (var i = 0; i < data.options.length; i++) { var voteCTA = $("#voteCTA"); voteCTA.empty(); // Clear existing content $("#voteCTA").append(" Voting has ended for this journal entry. Please take a look at the most recent entry in order to vote."); var option = data.options[i]; if (option.selected) { entryOptions.append( '' + '' ); } else { entryOptions.append( '' + '' ); } } } } $(document).on('click', '.entryButton', function() { var entryPK = $(this).val(); getEntry(entryPK) }); $(document).on('click', '#clear-button', function() { $('#entry-search').val(''); entrySearch('', 1) }); $(document).on('change', 'input:radio[id^="option_"]', function(event) { var optionID = $(this).attr('id').slice(7); var entryPK = $('[id^="activeEntry_"]').attr('id').slice(12); console.log('option vote button pressed') var labels = $('label.btn[for^="option_"]') var inputs = $('input:radio[id^="option_"]') var deleteButton = $('#deleteVote') // Disable buttons inputs.prop('disabled', true); deleteButton.prop('disabled', true); // Add the spinner inside the button labels.html('
Loading...
'); deleteButton.html('
Loading...
'); $.ajax({ type: "POST", url: "/play/entryVote/", data: { 'pk': entryPK, 'optionID': optionID, csrfmiddlewaretoken: csrftoken }, success: function(data) { updateVotes(data) } }); }); $(document).on("click", "#deleteVote", function() { var entryPK = $('[id^="activeEntry_"]').attr('id').slice(12); console.log('delete vote button pressed') // Disable the button $(this).prop('disabled', true); // Add the spinner inside the button $(this).html('
Loading...
'); // AJAX CALL TO SERVER $.ajax({ type: "POST", url: "/play/deleteVote/", data: { 'pk': entryPK, csrfmiddlewaretoken: csrftoken }, success: function(data) { if (!data.error) { console.log(data) console.log(data.error) updateVotes(data) } else { var alertContent = data.error; var alertHtml = '' ; // Append the alert HTML to a container element in your page $('#alertContainer').append(alertHtml); } } }); }); });