helialprofile.png
Welcome to IOPWiki, Commander.
We are lacking editors focused on Girls' Frontline and Girls' Frontline 2. You can contribute without an account. Learn how to contribute and join our Discord server.

Difference between revisions of "Widget:indexSorterGrouper"

Welcome to IOP Wiki. This website is maintained by the Girls' Frontline community and is free to edit by anyone.
Jump to navigation Jump to search
(Setting indicator for active button)
m (Missed some parts)
 
(32 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
<includeonly><script>
 
<includeonly><script>
−
RLQ.push(function () {
+
RLQ.push(['jquery', function () {
 
   $(document).ready(function() {
 
   $(document).ready(function() {
 +
    // initially remove the paragraph
 +
    var parents = $(".mw-headline").closest("h2");
 +
    parents.each(function() {
 +
      var parent = $(this);
 +
      var paragraph = parent.next('p');
 +
      paragraph.replaceWith(paragraph.children());
 +
    });
 +
   
 
     // For now, we have to make sure the data is there (Change the template, dammit!)
 
     // For now, we have to make sure the data is there (Change the template, dammit!)
−
$(".card-bg-small").each(function() {
+
$(".gfl-doll-card").each(function() {
 
  var element = $(this);
 
  var element = $(this);
−
  var name = element.find('span').first().text();
+
  var name = element.find('.name').first().text();
−
  var index = parseInt(element.find('span').last().text());
+
  var index = parseInt(element.find('.index').last().text());
−
  var srcStr = element.find("img").eq(2).attr("src");
+
  var srcStr = element.find("img.rarity-class").attr("src");
 
  var myRegexp = /^.*Icon_(.*)_(.*)star.*$/g;
 
  var myRegexp = /^.*Icon_(.*)_(.*)star.*$/g;
 
  var match = myRegexp.exec(srcStr);
 
  var match = myRegexp.exec(srcStr);
 
  var classification = match[1];
 
  var classification = match[1];
 
  var rarity = match[2];
 
  var rarity = match[2];
−
   
+
         
 +
          var serverDataSpans = $("span.serverdata[data-server-doll='" + name + "']");
 +
          serverDataSpans.each(function() {
 +
            var serverDataSpan = $(this);
 +
            var serverShort = serverDataSpan.attr('data-server-released');
 +
            var serverDollName = serverDataSpan.attr('data-server-releasename');
 +
            element.attr("data-server-" + serverShort, serverDollName);
 +
          });
 +
          serverDataSpans.remove();
 +
 
 +
  element.attr('data-server-WIKI', name);
 
  element.data('name', name);
 
  element.data('name', name);
 
  element.data('index', index);
 
  element.data('index', index);
Line 20: Line 38:
 
      
 
      
 
     // Once everything is ready, default-sort it
 
     // Once everything is ready, default-sort it
−
     orderByName();
+
     $('[data-initialsort]').click();
 +
   
 +
    // Activate ui for user
 +
    $(".gf-button").prop('disabled', false);
 +
    $('.removeAfterInitIsg').remove();
 
   });
 
   });
−
});
+
}]);
  
 
function orderByName(currentButton) {
 
function orderByName(currentButton) {
−
   tdollSorterActiveButton(currentButton);
+
   var sortOrder = tdollSorterActiveButton(currentButton);
 
    
 
    
 
   var comparer = function (a, b) {
 
   var comparer = function (a, b) {
 
     var nameA=$(a).data('name').toLowerCase();
 
     var nameA=$(a).data('name').toLowerCase();
 
     var nameB=$(b).data('name').toLowerCase();
 
     var nameB=$(b).data('name').toLowerCase();
−
     if (nameA < nameB) return -1;
+
     if (nameA < nameB) return -1 * sortOrder;
−
     if (nameA > nameB) return 1;
+
     if (nameA > nameB) return 1 * sortOrder;
 
     return 0;
 
     return 0;
 
   };
 
   };
 
    
 
    
 
   var grouper = function (parent, elements) {
 
   var grouper = function (parent, elements) {
−
     if (parent.find('#Unreleased_T-Dolls').length > 0 || parent.find('#Extra_T-Dolls').length > 0) {
+
     var currentLetter = getFirstLetterGroup($(elements).first().data('name'));
−
      return;
+
     var groupHeader = $("<h3 />").text(currentLetter.toUpperCase() + "...").addClass("addedbysorter");
−
    }
 
−
   
 
−
     var groupHeader = $("<h3 />").text("#...").addClass("addedbysorter");
 
 
     groupHeader.insertBefore(elements.first());
 
     groupHeader.insertBefore(elements.first());
 
      
 
      
Line 47: Line 66:
 
       var nextElementLetter = getFirstLetterGroup($(elements[i+1]).data('name'));
 
       var nextElementLetter = getFirstLetterGroup($(elements[i+1]).data('name'));
 
       if (currentLetter !== nextElementLetter) {
 
       if (currentLetter !== nextElementLetter) {
−
        var linebreaker = $("<br />").addClass("addedbysorter");
 
−
        linebreaker.insertAfter(element);
 
 
         var groupHeaderText = nextElementLetter.toUpperCase() + "...";
 
         var groupHeaderText = nextElementLetter.toUpperCase() + "...";
 
         if (groupHeaderText.trim() != "...") {
 
         if (groupHeaderText.trim() != "...") {
 
           var groupHeader = $("<h3 />").text(groupHeaderText).addClass("addedbysorter");
 
           var groupHeader = $("<h3 />").text(groupHeaderText).addClass("addedbysorter");
−
           groupHeader.insertAfter(linebreaker);
+
           groupHeader.insertAfter(element);
 
         }
 
         }
 
       }
 
       }
Line 75: Line 92:
  
 
function orderByRarityClassName(currentButton) {
 
function orderByRarityClassName(currentButton) {
−
   tdollSorterActiveButton(currentButton);
+
   var sortOrder = tdollSorterActiveButton(currentButton);
 
    
 
    
 
   var comparer = function (a, b) {
 
   var comparer = function (a, b) {
 
       var contentA = getSortKeyForRarityClassName($(a));
 
       var contentA = getSortKeyForRarityClassName($(a));
 
       var contentB = getSortKeyForRarityClassName($(b));
 
       var contentB = getSortKeyForRarityClassName($(b));
−
       return (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0;
+
       var comp = (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0;
 +
      return comp * sortOrder;
 
     };
 
     };
 
    
 
    
−
   tdollSorter(comparer);
+
  var grouper = getClassAndRarityGrouper();
 +
 
 +
   tdollSorter(comparer, grouper);
 
}
 
}
  
 
function orderByClassRarityName(currentButton) {
 
function orderByClassRarityName(currentButton) {
−
   tdollSorterActiveButton(currentButton);
+
   var sortOrder = tdollSorterActiveButton(currentButton);
 
    
 
    
 
   var comparer = function (a, b) {
 
   var comparer = function (a, b) {
 
       var contentA = getSortKeyForClassRarityName($(a));
 
       var contentA = getSortKeyForClassRarityName($(a));
 
       var contentB = getSortKeyForClassRarityName($(b));
 
       var contentB = getSortKeyForClassRarityName($(b));
−
       return (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0;
+
       var comp = (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0;
 +
      return comp * sortOrder;
 
     };
 
     };
 
    
 
    
−
   tdollSorter(comparer);
+
  var grouper = getClassAndRarityGrouper();
 +
 
 +
   tdollSorter(comparer, grouper );
 
}
 
}
  
−
function getSortKeyForClassRarityName(element) {
+
function getClassAndRarityGrouper() {
 +
  var grouper = function (parent, elements) {
 +
    createClassRarityGroup(parent, elements.first());
 +
   
 +
    $.grep(elements, function(element, i) {
 +
      if (elements.length <= i+1) {
 +
        return true;
 +
      }
 +
      var nextElement = elements[i+1];
 +
     
 +
      createClassRarityGroup($(element), nextElement);
 +
     
 +
      return true;
 +
    });
 +
  };
 +
  return grouper;
 +
}
 +
 
 +
function createClassRarityGroup(element1, nextElement) {
 +
  var currentKey = getSortKeyForClassRarityName(element1, true);
 +
  var nextElementKey = getSortKeyForClassRarityName(nextElement, true);
 +
 
 +
  if (currentKey !== nextElementKey) {
 +
    var groupHeaderText = $(nextElement).data('classification') + " " + getNumberForRarity(nextElement) + "-Star";
 +
    var groupHeader = $("<h3 />").text(groupHeaderText).addClass("addedbysorter");
 +
    groupHeader.insertAfter(element1);
 +
  }
 +
}
 +
 
 +
function getSortKeyForClassRarityName(element, withoutName) {
 
   var classification = getNumberForClassification(element);
 
   var classification = getNumberForClassification(element);
 
   var rarity = getNumberForRarity(element);
 
   var rarity = getNumberForRarity(element);
 
   var name = $(element).data('name');
 
   var name = $(element).data('name');
−
   return classification + "_" + rarity + "_" + name;
+
   return classification + "_" + rarity + (withoutName ? "" : ("_" + name));
 
}
 
}
  
Line 114: Line 166:
 
function getNumberForRarity(element) {
 
function getNumberForRarity(element) {
 
   var rawRarity = $(element).data('rarity');
 
   var rawRarity = $(element).data('rarity');
−
   if (!rawRarity || rawRarity == null || isNaN(rawRarity)) {
+
 
 +
   if (!rawRarity || rawRarity == null) {
 +
    return 9;
 +
  }
 +
 
 +
  if (("" + rawRarity).toLowerCase() === "extra") {
 +
    return "Extra";
 +
  }
 +
 
 +
  if (isNaN(rawRarity)) {
 
     return 9;
 
     return 9;
 
   }
 
   }
Line 146: Line 207:
  
 
function orderByIndex(currentButton) {
 
function orderByIndex(currentButton) {
−
   tdollSorterActiveButton(currentButton);
+
   var sortOrder = tdollSorterActiveButton(currentButton);
 
    
 
    
 
   var comparer = function (a, b) {
 
   var comparer = function (a, b) {
 
       var contentA = parseInt($(a).data('index'));
 
       var contentA = parseInt($(a).data('index'));
 
       var contentB = parseInt($(b).data('index'));
 
       var contentB = parseInt($(b).data('index'));
−
       return (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0;
+
       var comp = (contentA < contentB) ? -1 : (contentA > contentB) ? 1 : 0;
 +
      return comp * sortOrder;
 
     };
 
     };
 
    
 
    
 
   var grouper = function (parent, elements) {
 
   var grouper = function (parent, elements) {
−
     var firstTen = Math.ceil(parseInt(elements.first().data('index')) / 10) * 10;
+
     var firstIndex = elements.first().data('index');
−
     var groupHeader = $("<h3 />").text("..." + firstTen).addClass("addedbysorter");
+
    var firstTen = Math.ceil(parseInt(firstIndex) / 10) * 10;
 +
    if (sortOrder == -1) { firstTen -= 9; }
 +
     var groupHeader = $("<h3 />").text(getNumberText(firstIndex) + "..." + getNumberText(firstTen)).addClass("addedbysorter");
 
     groupHeader.insertBefore(elements.first());
 
     groupHeader.insertBefore(elements.first());
 
      
 
      
 
     $.grep(elements, function(element, i) {
 
     $.grep(elements, function(element, i) {
−
       var currentTen = Math.ceil(parseInt($(element).data('index')) / 10) * 10;
+
       if (elements <= i+1) {
−
      var nextElementTen = Math.ceil(parseInt($(elements[i+1]).data('index')) / 10) * 10;
+
         return true;
−
      if (currentTen !== nextElementTen) {
 
−
         var linebreaker = $("<br />").addClass("addedbysorter");
 
−
        linebreaker.insertAfter(element);
 
−
       
 
−
        var groupHeaderText = currentTen + "..." + nextElementTen;
 
−
        if (!isNaN(nextElementTen)) {
 
−
          var groupHeader = $("<h3 />").text(groupHeaderText).addClass("addedbysorter");
 
−
          groupHeader.insertAfter(linebreaker);
 
−
        }
 
 
       }
 
       }
 +
      var nextElement = $(elements[i+1]);
 +
     
 +
      createIndexGroup(element, nextElement, sortOrder);
 +
     
 
       return true;
 
       return true;
 
     });
 
     });
Line 177: Line 236:
 
    
 
    
 
   tdollSorter(comparer, grouper);
 
   tdollSorter(comparer, grouper);
 +
}
 +
 +
function getNumberText(val) {
 +
  if (!val || isNaN(val)) {
 +
    return "";
 +
  }
 +
  return "" + val;
 +
}
 +
 +
function createIndexGroup(element, nextElement, sortOrder) {
 +
  var currentTen = Math.ceil(parseInt($(element).data('index')) / 10) * 10;
 +
  var nextElementTen = Math.ceil(parseInt(nextElement.data('index')) / 10) * 10;
 +
  if (currentTen !== nextElementTen) {
 +
    if (!isNaN(nextElementTen)) {
 +
      if (sortOrder == -1) {
 +
        currentTen -= 10;
 +
        nextElementTen -= 9;
 +
      }
 +
     
 +
      var currentIdxShow = currentTen;
 +
      if (sortOrder != -1 && currentIdxShow > 1) currentIdxShow += 1;
 +
      var groupHeaderText = getNumberText(currentIdxShow) + "..." + getNumberText(nextElementTen);
 +
     
 +
      var groupHeader = $("<h3 />").text(groupHeaderText).addClass("addedbysorter");
 +
      groupHeader.insertAfter(element);
 +
    }
 +
  }
 
}
 
}
  
 
function tdollSorterActiveButton(butt) {
 
function tdollSorterActiveButton(butt) {
−
   $('[data-tdollsortbutton="true"]').removeClass("enabled");
+
  var isAscending = $(butt).is('.ascending')
 +
   $('[data-tdollsortbutton="true"]').removeClass("enabled").removeClass("ascending");
 +
  $(butt).addClass("enabled");
 +
 
 +
  if (isAscending) {
 +
    return -1;
 +
  } else {
 +
    $(butt).addClass('ascending');
 +
    return 1;
 +
  }
 +
}
 +
 
 +
function switchServer(butt) {
 +
  var activeServer = $(butt).attr('data-tdollserver');
 +
 
 +
  $('[data-tdollserverbutton="true"]').removeClass("enabled");
 +
 
 +
  $('.gfl-doll-card.unreleased').removeClass('unreleased');
 +
  $('.gfl-doll-card').each(function() {
 +
    var element = $(this);
 +
    var nameToSet = "";
 +
    if (element.is("[data-server-" + activeServer + "]")) {
 +
      nameToSet = element.attr('data-server-' + activeServer);
 +
    } else {
 +
      element.addClass('unreleased');
 +
      nameToSet = element.attr('data-server-wiki');
 +
    }
 +
    element.find('.name').first().text(nameToSet);
 +
  });
 +
 
 
   $(butt).addClass("enabled");
 
   $(butt).addClass("enabled");
 
}
 
}
Line 190: Line 305:
 
   parents.each(function() {
 
   parents.each(function() {
 
     var parent = $(this);
 
     var parent = $(this);
−
     var elements = parent.nextUntil("h2", ".card-bg-small");
+
    // All elements inside the paragraph after the h2 which have special class
 +
     var elements = parent.nextUntil("h2", ".gfl-doll-card");
 
    
 
    
 
     elements.detach().sort(comparer);
 
     elements.detach().sort(comparer);
Line 202: Line 318:
 
}
 
}
 
</script><div style="display:inline-block">
 
</script><div style="display:inline-block">
−
<button class="gf-button" data-tdollsortbutton="true" onclick="orderByName(this);">By Name</button>
+
<button class="gf-button" data-tdollsortbutton="true" disabled data-initialsort="true" onclick="orderByClassRarityName(this);">By Class&gt;Rarity&gt;Name</button>
−
<button class="gf-button" data-tdollsortbutton="true" onclick="orderByClassRarityName(this);">By Class&gt;Rarity&gt;Name</button>
+
<button class="gf-button" data-tdollsortbutton="true" disabled onclick="orderByRarityClassName(this);">By Rarity&gt;Class&gt;Name</button>
−
<button class="gf-button" data-tdollsortbutton="true" onclick="orderByRarityClassName(this);">By Rarity&gt;Class&gt;Name</button>
+
<button class="gf-button" data-tdollsortbutton="true" disabled onclick="orderByName(this);">By Name</button>
−
<button class="gf-button" data-tdollsortbutton="true" onclick="orderByIndex(this);">By Index</button></div>
+
<button class="gf-button" data-tdollsortbutton="true" disabled onclick="orderByIndex(this);">By Index</button>
 +
<div style="width:20px; height:20px; display:inline-block;" class="loading2 removeAfterInitIsg">&nbsp;</div></div>
 +
 
 +
<p>
 +
Released on this server:<br/>
 +
<button class="gf-button" data-tdollserverbutton="true" data-tdollserver="WIKI" disabled data-initialsort="true" onclick="switchServer(this);">All</button>
 +
<button class="gf-button" data-tdollserverbutton="true" data-tdollserver="CN" disabled onclick="switchServer(this);">CN</button>
 +
<button class="gf-button" data-tdollserverbutton="true" data-tdollserver="TW" disabled onclick="switchServer(this);">TW</button>
 +
<button class="gf-button" data-tdollserverbutton="true" data-tdollserver="KR" disabled onclick="switchServer(this);">KR</button>
 +
<button class="gf-button" data-tdollserverbutton="true" data-tdollserver="EN" disabled onclick="switchServer(this);">EN</button>
 +
<button class="gf-button" data-tdollserverbutton="true" data-tdollserver="JP" disabled onclick="switchServer(this);">JP</button>
 +
</p>
 
</includeonly>
 
</includeonly>
  

Latest revision as of 22:28, 24 June 2024


 

Released on this server:

Some heading

Retrieved from "http://iopwiki.com/index.php?title=Widget:indexSorterGrouper&oldid=141799"