mirror of
				https://github.com/KevinMidboe/zoff.git
				synced 2025-10-29 18:00:23 +00:00 
			
		
		
		
	Buttons top and bottom for filtering pagination
This commit is contained in:
		| @@ -386,11 +386,18 @@ li.disabled span { | |||||||
| .filter-pagination-container { | .filter-pagination-container { | ||||||
|     display: flex; |     display: flex; | ||||||
|     justify-content: space-evenly; |     justify-content: space-evenly; | ||||||
|     padding-top: 15px; |  | ||||||
|     width: 50%; |     width: 50%; | ||||||
|     margin: auto; |     margin: auto; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | .bottom-filter-container { | ||||||
|  |     padding-top: 15px; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | .top-filter-container { | ||||||
|  |     padding-bottom: 15px; | ||||||
|  | } | ||||||
|  |  | ||||||
| .extra-button{ | .extra-button{ | ||||||
|     margin: 0 4px !important; |     margin: 0 4px !important; | ||||||
|     padding: 0px !important; |     padding: 0px !important; | ||||||
|   | |||||||
| @@ -37,22 +37,11 @@ function filterPlaylistElements(page) { | |||||||
|             var json = JSON.parse(data); |             var json = JSON.parse(data); | ||||||
|             document.querySelector(".filter-results").innerHTML = ""; |             document.querySelector(".filter-results").innerHTML = ""; | ||||||
|             if(json.results.search_results.length > 0) { |             if(json.results.search_results.length > 0) { | ||||||
|  |                 addFilterButtons("top", json); | ||||||
|                 for(var i = 0; i < json.results.search_results.length; i++) { |                 for(var i = 0; i < json.results.search_results.length; i++) { | ||||||
|                     document.querySelector(".filter-results").innerHTML += List.generateSong(json.results.search_results[i], false, false, true, false, "block", false, true);; |                     document.querySelector(".filter-results").innerHTML += List.generateSong(json.results.search_results[i], false, false, true, false, "block", false, true);; | ||||||
|                 } |                 } | ||||||
|                 if(json.results.next != undefined || json.results.prev != undefined) { |                 addFilterButtons("bottom", json); | ||||||
|                     document.querySelector(".filter-results").innerHTML += "<div class='filter-pagination-container'></div>" |  | ||||||
|                     if(json.results.prev != undefined) { |  | ||||||
|                         document.querySelector(".filter-pagination-container").innerHTML += "<a href='#' class='btn orange prev-filter' data-page='" + json.results.prev + "'>Prev</a>"; |  | ||||||
|                     } else { |  | ||||||
|                         document.querySelector(".filter-pagination-container").innerHTML += "<a href='#' class='btn orange disabled'>Prev</a>"; |  | ||||||
|                     } |  | ||||||
|                     if(json.results.next != undefined) { |  | ||||||
|                         document.querySelector(".filter-pagination-container").innerHTML += "<a href='#' class='btn orange next-filter' data-page='" + json.results.next + "'>Next</a>"; |  | ||||||
|                     } else { |  | ||||||
|                         document.querySelector(".filter-pagination-container").innerHTML += "<a href='#' class='btn orange disabled'>Next</a>"; |  | ||||||
|                     } |  | ||||||
|                 } |  | ||||||
|             } else { |             } else { | ||||||
|                 toast("Couldn't find any items with those tags..", "red"); |                 toast("Couldn't find any items with those tags..", "red"); | ||||||
|                 document.querySelector(".filter-results").innerHTML = "Couldn't find any items with those tags.."; |                 document.querySelector(".filter-results").innerHTML = "Couldn't find any items with those tags.."; | ||||||
| @@ -66,6 +55,22 @@ function filterPlaylistElements(page) { | |||||||
|     }); |     }); | ||||||
| } | } | ||||||
|  |  | ||||||
|  | function addFilterButtons(position, json) { | ||||||
|  |     if(json.results.next != undefined || json.results.prev != undefined) { | ||||||
|  |         document.querySelector(".filter-results").innerHTML += "<div class='filter-pagination-container " + position + "-filter-container'></div>" | ||||||
|  |         if(json.results.prev != undefined) { | ||||||
|  |             document.querySelector("." + position + "-filter-container").innerHTML += "<a href='#' class='btn orange prev-filter' data-page='" + json.results.prev + "'>Prev</a>"; | ||||||
|  |         } else { | ||||||
|  |             document.querySelector("." + position + "-filter-container").innerHTML += "<a href='#' class='btn orange disabled'>Prev</a>"; | ||||||
|  |         } | ||||||
|  |         if(json.results.next != undefined) { | ||||||
|  |             document.querySelector("." + position + "-filter-container").innerHTML += "<a href='#' class='btn orange next-filter' data-page='" + json.results.next + "'>Next</a>"; | ||||||
|  |         } else { | ||||||
|  |             document.querySelector("." + position + "-filter-container").innerHTML += "<a href='#' class='btn orange disabled'>Next</a>"; | ||||||
|  |         } | ||||||
|  |     } | ||||||
|  | } | ||||||
|  |  | ||||||
| function say_updated() { | function say_updated() { | ||||||
|     setTimeout(function() { |     setTimeout(function() { | ||||||
|         before_toast(); |         before_toast(); | ||||||
|   | |||||||
| @@ -710,6 +710,9 @@ function addDynamicListeners() { | |||||||
|         var page = e.getAttribute("data-page"); |         var page = e.getAttribute("data-page"); | ||||||
|         page = parseInt(page); |         page = parseInt(page); | ||||||
|         if(page == undefined || isNaN(page)) return; |         if(page == undefined || isNaN(page)) return; | ||||||
|  |         e.classList.remove("next-filter"); | ||||||
|  |         e.classList.remove("orange"); | ||||||
|  |         e.className += " disabled"; | ||||||
|         filterPlaylistElements(page); |         filterPlaylistElements(page); | ||||||
|     }); |     }); | ||||||
|  |  | ||||||
| @@ -718,6 +721,9 @@ function addDynamicListeners() { | |||||||
|         var page = e.getAttribute("data-page"); |         var page = e.getAttribute("data-page"); | ||||||
|         page = parseInt(page); |         page = parseInt(page); | ||||||
|         if(page == undefined || isNaN(page)) return; |         if(page == undefined || isNaN(page)) return; | ||||||
|  |         e.classList.remove("prev-filter"); | ||||||
|  |         e.classList.remove("orange"); | ||||||
|  |         e.className += " disabled"; | ||||||
|         filterPlaylistElements(page); |         filterPlaylistElements(page); | ||||||
|     }); |     }); | ||||||
|  |  | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user