MediaWiki:SectionStyling.js

/* 
==========================================
 @meepledrone - Section Styling 
==========================================
*/


var CategoryPool = 
{
  firstEdition: 
  {
    names: [ "First Edition", "Erste Edition", "Hunters And Gatherers", "New World" ],
    desktopRules: 
    [ 
      'div#mw-content-text > div > h3, div#mw-content-text > div#wikiPreview > div > div > h3 { background-image: url("/images/d/dd/Carcassonne_C1_Headline_Strip.jpg"); background-size: auto 36px; padding: 6px !important; margin-top: 18px !important; margin-bottom: 18px !important; filter: brightness(1); }',
      '.wica-banner-icon { position: relative; top: -70px; margin-right: 10px; }',
      '.wica-banner-spacer { display: none; }' 
    ],
    mobileRules: 
    [
      'div#mw-content-text > div.mw-parser-output > div > div > h3 { background-image: url("/images/d/dd/Carcassonne_C1_Headline_Strip.jpg"); background-size: auto 36px; padding-left: 0.5em !important; margin-top: 15px !important; margin-bottom: 15px !important; filter: brightness(1); }',
      '.wica-banner-icon { }',
      '.wica-banner-spacer { clear: both; }' 
   ],
    disabled: false
  },

  secondEdition: 
  {
    names: [ "Second Edition", "Zweite Edition" ],
    desktopRules: 
    [ 
      'div#mw-content-text > div > h3, div#mw-content-text > div#wikiPreview > div > div > h3 { background-image: url("/images/4/46/Section_Separator.jpg"); background-size: auto 36px; padding: 6px !important; margin-top: 18px !important; margin-bottom: 18px !important; filter: contrast(0.8); }',
      '.wica-banner-icon { position: relative; top: -70px; margin-right: 10px; }',
      '.wica-banner-spacer { display: none; }' 
    ],
    mobileRules: 
    [
      'div#mw-content-text > div.mw-parser-output > div > div > h3 { background-image: url("/images/4/46/Section_Separator.jpg"); background-size: auto 36px; padding-left: 0.5em !important; margin-top: 15px !important; margin-bottom: 15px !important; filter: contrast(0.8); }',
      '.wica-banner-icon { }',
      '.wica-banner-spacer { clear: both; }' 
   ],
    disabled: false
  },

  winterEdition: 
  {
    names: [ "Winter Edition" ],
    desktopRules: 
    [ 
      'div#mw-content-text > div > h3, div#mw-content-text > div#wikiPreview > div > div > h3 { background-image: url("/images/b/bd/Winter_Edition_Headline_Strip.png"); background-size: auto 36px; padding: 6px !important; margin-top: 18px !important; margin-bottom: 18px !important; filter: brightness(1); }',
      '.wica-banner-icon { position: relative; top: -70px; margin-right: 10px; }',
      '.wica-banner-spacer { display: none; }' 
    ],
    mobileRules: 
    [
      'div#mw-content-text > div.mw-parser-output > div > div > h3 { background-image: url("/images/b/bd/Winter_Edition_Headline_Strip.png"); background-size: auto 36px; padding-left: 0.5em !important; margin-top: 15px !important; margin-bottom: 15px !important; filter: brightness(1); }',
      '.wica-banner-icon { }',
      '.wica-banner-spacer { clear: both; }' 
   ],
    disabled: false
  },

  safari: 
  {
    names: [ "Safari" ],
    desktopRules: 
    [ 
      'div#mw-content-text > div > h3, div#mw-content-text > div#wikiPreview > div > div > h3 { background-image: url("/images/b/b4/Safari_Headeline_Strip.png"); background-size: auto 36px; padding: 6px !important; margin-top: 18px !important; margin-bottom: 18px !important; filter: brightness(1); }',
      '.wica-banner-icon { position: relative; top: -70px; margin-right: 10px; }',
      '.wica-banner-spacer { display: none; }' 
    ],
    mobileRules: 
    [
      'div#mw-content-text > div.mw-parser-output > div > div > h3 { background-image: url("/images/b/b4/Safari_Headeline_Strip.png"); background-size: auto 36px; padding-left: 0.5em !important; margin-top: 15px !important; margin-bottom: 15px !important; filter: brightness(1); }',
      '.wica-banner-icon { }',
      '.wica-banner-spacer { clear: both; }' 
   ],
    disabled: false
  },
 
};






// If any category listed in arrPageCategories matches an entry in CategoryPool, 
// applies the styling according to the current view: desktop or mobile
//
function doStylingByCategory( arrPageCategories )
{
  // Traverse CategoryPool skipping disabled entries...
  //
  for ( var strKey in CategoryPool )
  {
    var oCategory = CategoryPool[ strKey ];
    
    if ( oCategory.disabled ) continue;

    // Traverses the category names in one entry...
    //
    var arrCategoryNames = oCategory.names;
    var nCategoryNames = arrCategoryNames.length;
    for ( var k = 0; k < nCategoryNames; k++ )
    {
      var strCategoryName = arrCategoryNames[ k ];

      // ...and checks if there is a match with the page category list 

      var bFound = false;
      var nPageCategories = arrPageCategories.length;
      for ( var i = 0; i < nPageCategories; i++ )
      {
        var strPageCategory = arrPageCategories[ i ];
        if ( strCategoryName == strPageCategory )
        {
          bFound = true;
          break;
        }
      }

      // If found a match, injects the associated rules and exits the main loop
      //
      if ( bFound )
      {
        var strMobileSkin = mw.config.get( 'skin' );
        console.log( "Default Skin:" + strMobileSkin );

        var arrRules = ( strMobileSkin == "vector" ? oCategory.desktopRules : oCategory.mobileRules );
        var nRules = arrRules.length;
        for ( j = 0; j < nRules; j++ )
        {
          var strRule = arrRules[ j ];
          mw.util.addCSS( strRule );
        }

        break;
      }
    }    
  }  
}


/*
   === Loading categories asynchronously ===
*/

/*
// Auxiliary function for debugging
//
function dumpObject( strName, o )
{
  for ( var strKey in o )
  {
    console.log( strName + "[" + strKey + "] = [" + o[strKey] + "]"  );
  }
}
*/

// Removes the "Category:" prefix if present. 
//   If strCategory is "Category:ABC", returns "ABC"; otherwise, strCategory unchanged 
//
function stripPrefix ( strCategory )
{
  var strRes = strCategory;
  var arrRes = strRes.split(":");

  if ( ( arrRes.length == 2 ) && ( arrRes[0] === "Category" ) )
  {
    strRes = arrRes[1];
  }

  return strRes;
}

// Processes the response from mw.API.get() to produce an array with category names
//
function getCategories( oData ) 
{
  var arrResult = [];

  var oPage = oData.query.pages[ wgArticleId ];
 
  if ( oPage.categories ) 
  {
    oPage.categories.map( 
      function ( oCategory ) { arrResult.push( stripPrefix( oCategory.title ) ); } 
    );
 
    // Works as expected.
    console.log( "Category:" + arrResult );
  }

  return arrResult;
}


// Load categories using mw.API and executes callback 
//
function loadCategories( fCallback )
{
  var wgArticleId = mw.config.get( 'wgArticleId' );

  console.log( "ArticleId:" + wgArticleId );

  var parameters = {
      action: 'query',
      pageids: wgArticleId,
      prop: 'categories',
      clprop: 'hidden',
      cllimit: 500
  };

  mw.loader.using( [ 'mediawiki.api' ],
    function() { 
      new mw.Api().get( parameters ).done( 
        function( oData ) { 
          var arrPageCategories = getCategories( oData ); 
          fCallback( arrPageCategories );
        } 
      ); 
    }
  );
}


function doInitStylingByCategory()
{
  var arrPageCategories = mw.config.get('wgCategories');
  console.log( "Content Categories:" + arrPageCategories );

  // Check if the categories list is avalailable
  //
  if ( arrPageCategories == null )
  {
    // If not available, load the category list using mw.API and then apply styling
    loadCategories( doStylingByCategory );
  }
  else
  {
    // If available, apply styling directly
    doStylingByCategory( arrPageCategories );
  }
}

doInitStylingByCategory();