urba/static/main.js

$(document).ready(function() {
    
    var imgW =  $(".gal .img_container").width()
    $(".gal .img_container").css('height',imgW);
    
    $(".alist").on("click", "li",function(){
    $(".content-wrapper").removeClass('open');   
    $(this).find(".content-wrapper").addClass('open');   
});


$("a.news").click(function(){
    $("#news").toggleClass('open');
});   

$("a.info").click(function(){
    $("#info").toggleClass('open');
});

$(".closebtn").click(function(e){
    e.stopPropagation(); // Prevent event bubbling
    $(this).parent().removeClass('open');
    console.log("Close button clicked - should remove 'open' class");
});

$("#bg").click(function(){
    $(this).css('display','none');
});
    
    //
    //$(".alist").on("click", "li",function(){
        //$(".content-wrapper").removeClass('open');   
        //$(this).find(".content-wrapper").addClass('open');   
    //});
    
    //$("a.news").click(function(){
        //$("#news").toggleClass('open');
     //});   

    //$("a.info").click(function(){
        //$("#info").toggleClass('open');
    //});

    //$(".closebtn").click(function(){
        //$(this).parent().removeClass('open');
        //$(this).parent().toggleClass('wkfhjsldkgfh');
        //console.log("fuubar");
    //});

      $(document).on("click", ".gal img", function() {
          var clickedSrc = $(this).attr("src");
          console.log(clickedSrc);
          $(this).closest(".gal").next(".imgzoom").find("img").attr("src", clickedSrc);
  });


    let currentSort = null;
    let currentDirection = 'asc';

  // Click handler for sort buttons
  $('.legend li.sort').click(function() {
    const sortBy = $(this).attr('data-sort');
    console.log("Sorting by:", sortBy); // Debug info

    // Toggle direction if clicking the same sort again
    if (currentSort === sortBy) {
      currentDirection = currentDirection === 'asc' ? 'desc' : 'asc';
    } else {
      currentDirection = 'asc';
    }

    currentSort = sortBy;
    console.log("Direction:", currentDirection); // Debug info

    // Get the list and all articles
    const $list = $('ul.alist');
    if ($list.length === 0) {
      console.error("List with class 'alist' not found"); // Debug info
      return;
    }

    // Get all list items
    let $articles = $list.children('li').toArray();
    console.log("Found", $articles.length, "articles"); // Debug info

    // Sort the articles
    $articles.sort(function(a, b) {
      // Find the spans with the sorting class
      const $spanA = $(a).find('span.' + sortBy);
      const $spanB = $(b).find('span.' + sortBy);

      // If either element doesn't have the required span, skip sorting
      if ($spanA.length === 0 || $spanB.length === 0) {
        return 0;
      }

      const valueA = $spanA.text().trim().toLowerCase();
      const valueB = $spanB.text().trim().toLowerCase();

      // Try sorting as numbers if possible
      const numA = parseFloat(valueA);
      const numB = parseFloat(valueB);

      let result;
      if (!isNaN(numA) && !isNaN(numB)) {
        result = numA - numB;
      } else {
        // Otherwise sort alphabetically
        result = valueA.localeCompare(valueB);
      }

      // Reverse if descending
      return currentDirection === 'desc' ? -result : result;
    });

    // Re-append in new order
    $list.empty();
    $.each($articles, function(i, item) {
      $list.append(item);
    });

    // Update UI indicators
    $('.legend li.sort').removeClass('active sort-asc sort-desc');
    $(this).addClass('active');
    $(this).addClass(currentDirection === 'asc' ? 'sort-asc' : 'sort-desc');
  });


});