User:Locke/common.js: Difference between revisions

From Zelda Dungeon Wiki
Jump to navigation Jump to search
Want an adless experience? Log in or Create an account.
No edit summary
mNo edit summary
Line 45: Line 45:
     $(this).on( 'click', function() {
     $(this).on( 'click', function() {
       $('#'+target+' div').hide();
       $('#'+target+' div').hide();
       $('.tabset[data-tab-target="'+target+'"][data-tab-selector="'+selector'"] .tab2').removeClass( 'active' );
       $('.tabset[data-tab-target="'+target+'"][data-tab-selector="'+selector+'"] .tab2').removeClass( 'active' );
       $(this).addClass( 'active' );
       $(this).addClass( 'active' );
       tabselect( target, selector, selection );
       tabselect( target, selector, selection );

Revision as of 21:45, November 15, 2014

/*
Three different behaviors desired:

1. all content on one page
-all content is initially visible for no-js. js hides all except "default"

2. content is on subpages, transcluded
-"no-js" content is initially visible, the rest hidden. js hides "no-js" and shows "default"

3. ajax
-"no-js" content is initially visible. js removes "no-js" and calls for "default"
*/

$(function() {
var tabstate = {};

// hide the content
$('.tabtarget div').hide();

// select a tab
var tabselect = function( target, selector, selection ) {
  tabstate[target][selector] = selection;
  var content = tabstate[target].join( ' ' );
  $('#'+target+' div[data-tab-content="'+content+'"]').show();
}

// look at each tabset's target and selector
$('.tabset').each( function() {
  var target = $(this).data( 'tabTarget' );
  tabstate[target] = tabstate[target] || [];
  var selector = $(this).data( 'tabSelector' );
  if( typeof selector === 'undefined' ) selector = tabstate[target].length;

  // look at each tab's selection
  $(this).find( '.tab2' ).each( function() {
    var selection = $(this).data( 'tabSelection' );

    // check default
    if( $(this).data( 'tabDefault' ) ) {
      $(this).addClass( 'active' );
      tabselect( target, selector, selection );
    }

    // onclick event
    $(this).on( 'click', function() {
      $('#'+target+' div').hide();
      $('.tabset[data-tab-target="'+target+'"][data-tab-selector="'+selector+'"] .tab2').removeClass( 'active' );
      $(this).addClass( 'active' );
      tabselect( target, selector, selection );
    });
  });
});
});

function DataLoader( basepage, target ) {
    this.loadData = function( subpage ) {
        mw.loader.using( 'mediawiki.api', function () {
            (new mw.Api()).ajax( {
                action: 'parse',
                format: 'json',
                prop: 'text',
                page: basepage + '/' + subpage
            } ).done ( function ( data ) {
                $('#' + target).empty();
                $('#' + target).append( data['parse']['text']['*'] );
            } );
        } );
    };
}

var loader = new DataLoader( 'User:Locke/Sandbox', 'dl-target' );
loader.loadData( 'Template' );