「MediaWiki:Mobile.js」の版間の差分

提供:エケペディア
ナビゲーションに移動 検索に移動
編集の要約なし
(オーバーレイ機能を削除。書き直し。タブ機能のテスト実装)
1行目: 1行目:
/* ここにあるすべてのJavaScriptは携帯機器版サイトの利用者に影響します */
/* ここにあるすべてのJavaScriptは携帯機器版サイトの利用者に影響します */


/*試験的コードを有効にする*/
mw.hook('wikipage.content').add(function() {
var beta = mw.util.getParamValue('beta'), enableTestCode;
 
if (beta == 'on') {
/* ページ最後に挿入されたページ・ナビゲーションを章の折り畳みの外側に出す */
    $.cookie('enable-test-code', 'on', { path: '/', expires: 30 });
var $lastContentBlock = mw.util.$content.children('h2:last + div');
    enableTestCode = true;
$lastContentBlock.children('table.collapsible').insertAfter($lastContentBlock);
} else if (beta == 'off') {
    $.cookie('enable-test-code', null);
} else {
    enableTestCode = $.cookie('enable-test-code') == 'on';
}


/*[[テンプレート:折り畳みボックス]]*/
/* [[テンプレート:折り畳みボックス]] */
var collapseCaption = '隠す';
var collapseCaption = '隠す';
var expandCaption = '表示';
var expandCaption = '表示';


function toggleCollapsible(key, e) {
function toggleCollapsible(key, e) {
    e.preventDefault();
     if (this.hasClass('collapsed')) {
     if (this.hasClass('collapsed')) {
         this.removeClass('collapsed').find('> tbody > tr:not(:first)').fadeIn();
         this.removeClass('collapsed').find('> tbody > tr:not(:first)').fadeIn();
26行目: 22行目:
         if (key) $.cookie(key, 'collapsed', { path: '/', expires: 90 });
         if (key) $.cookie(key, 'collapsed', { path: '/', expires: 90 });
     }
     }
    e.preventDefault();
}
}


function makeCollapsibleBoxes($content) {
mw.loader.using('mobile.stable.common', function() {
     $content.find('table.collapsible').each(function() {
     var M = mw.mobileFrontend;
 
    /* 折り畳みボックス */
    mw.util.$content.find('table.collapsible').each(function() {
         var $table = $(this),
         var $table = $(this),
             collapse = $table.data('collapse');
             collapse = $table.data('collapse');
36行目: 34行目:
         $table.addClass('made-collapsible');
         $table.addClass('made-collapsible');


         var $button = $('<span class="collapseButton">[<a href="#"></a>]</span>');
         var $button = $table.find('tr:first > td:first > .collapseButton');
        $table.find('tr:first > td:first').prepend($button);
         $table.$toggle = $button.append('[<a href="#"></a>]').children();
         $table.$toggle = $button.children();


         if (/^cookie-(.+)$/.test(collapse)) {
         if (/^cookie-(.+)$/.test(collapse)) {
             var key = 'collapse-' + RegExp.$1;
             var key = 'collapse-' + RegExp.$1;
             collapse = $.cookie(key) || 'autocollapse';
             collapse = $.cookie(key) || 'autocollapse';
             $table.$toggle.on('click', $.proxy(toggleCollapsible, $table, key));
             $table.$toggle.on(M.tapEvent('click'),
                              $.proxy(toggleCollapsible, $table, key));
         } else {
         } else {
             $table.$toggle.on('click', $.proxy(toggleCollapsible, $table, null));
             $table.$toggle.on(M.tapEvent('click'),
                              $.proxy(toggleCollapsible, $table, null));
         }
         }


         if (collapse == 'collapsed' || (collapse == 'autocollapse' &&
         if (collapse == 'collapsed' || (collapse == 'autocollapse' &&
                                         $table.siblings('table.collapsible').length > 0)) {
                                         $table.siblings('table.collapsible').length)) {
             $table.addClass('collapsed').find('> tbody > tr:not(:first)').hide();
             $table.addClass('collapsed').find('> tbody > tr:not(:first)').hide();
             $table.$toggle.text(expandCaption);
             $table.$toggle.text(expandCaption);
56行目: 55行目:
         }
         }
     });
     });
}


mw.hook('wikipage.content').add(function() {
    /* タブ */
    /*ページ・ナビゲーションを章の外側に出す*/
    $('.tab-list').each(function() {
    var $lastContentBlock = mw.util.$content.children('h2:last + div');
        var $tabList = $(this),
    $lastContentBlock.children('table.collapsible').insertAfter($lastContentBlock);
            $tabContent = $tabList.nextAll('.tab-content'),
 
            $menu = $('<select>');
    if (!enableTestCode) makeCollapsibleBoxes(mw.util.$content);
         $tabList.find('> ul > li').each(function() {
 
          var $tab = $(this),
    /*旧エケペディアへの言語間リンクで「_」を「%20」に変換する*/
              $menuitem = $('<option>');
    $('#mw-mf-language-selection a:lang(akb49)').attr('href', function(i, href) {
          $menuitem.attr('value', $tab.data('tab'));
         return href.replace('_', '%20', 'g');
          $menuitem.text($tab.text());
    });
          if ($tab.hasClass('current-tab')) {
});
            $menuitem.attr('selected', 'selected');
 
          }
if (enableTestCode) {
          $menu.append($menuitem);
 
         });
/*[[テンプレート:折り畳みボックス]]をOverlayで表示*/
        $tabList.append($menu);
mw.loader.using('mobile.stable.common', function() {
        $menu.bind('change', function() {
    var CollapsibleBoxOverlay = mw.mobileFrontend.require('Overlay').extend({
            var index = $menu.val() - 1;
        className: 'collapsible-box-overlay mw-mf-overlay',
            $tabContent.hide().eq(index).show();
        initialize: function(options) {
        });
            var title = options.table.find('> tbody > tr > td.navbox-title').html(),
                content = '';
            options.heading = '<h2>' + title + '</h2>';
            options.table.find('> tbody > tr > td').each(function() {
                var $td = $(this);
                console.log($td.html());
                content += '<p class="' + $td.attr('class') + '">' + $td.html() + '</p>';
            });
            options.content = content;
            this._super(options);
         },
        postRender: function(options) {
            var self = this;
            this._super(options);
            this.$('table.collapsible').each(function() {
                var $table = $(this);
                $table.on('click', function(e) {
                    e.preventDefault();
                    new CollapsibleBoxOverlay({ table: $table, parent: self }).show();
                });
            });
        }
     });
     });


     mw.hook('wikipage.content').add(function() {
     /* 旧エケペディアへの言語間リンクで「_」を「%20」に置換する */
         mw.util.$content.find('table.collapsible').each(function() {
    M.on('language-overlay-initialize', function(options) {
             var $table = $(this);
         options.languages = options.languages.map(function(o) {
            $table.find('> tbody > tr:not(:first)').hide();
             if (o.lang === 'akb49') o.url = o.url.replace('_', '%20', 'g');
            $table.on('click', function(e) {
             return o;
                e.preventDefault();
                new CollapsibleBoxOverlay({ table: $table }).show();
             });
         });
         });
     });
     });
});
});


}
});

2014年4月25日 (金) 18:34時点における版

/* ここにあるすべてのJavaScriptは携帯機器版サイトの利用者に影響します */

mw.hook('wikipage.content').add(function() {

/* ページ最後に挿入されたページ・ナビゲーションを章の折り畳みの外側に出す */
var $lastContentBlock = mw.util.$content.children('h2:last + div');
$lastContentBlock.children('table.collapsible').insertAfter($lastContentBlock);

/* [[テンプレート:折り畳みボックス]] */
var collapseCaption = '隠す';
var expandCaption = '表示';

function toggleCollapsible(key, e) {
    e.preventDefault();
    if (this.hasClass('collapsed')) {
        this.removeClass('collapsed').find('> tbody > tr:not(:first)').fadeIn();
        this.$toggle.text(collapseCaption);
        if (key) $.cookie(key, 'uncollapsed', { path: '/', expires: 90 });
    } else {
        this.addClass('collapsed').find('> tbody > tr:not(:first)').fadeOut();
        this.$toggle.text(expandCaption);
        if (key) $.cookie(key, 'collapsed', { path: '/', expires: 90 });
    }
}

mw.loader.using('mobile.stable.common', function() {
    var M = mw.mobileFrontend;

    /* 折り畳みボックス */
    mw.util.$content.find('table.collapsible').each(function() {
        var $table = $(this),
            collapse = $table.data('collapse');
        if ($table.hasClass('made-collapsible') || collapse == 'plain') return;
        $table.addClass('made-collapsible');

        var $button = $table.find('tr:first > td:first > .collapseButton');
        $table.$toggle = $button.append('[<a href="#"></a>]').children();

        if (/^cookie-(.+)$/.test(collapse)) {
            var key = 'collapse-' + RegExp.$1;
            collapse = $.cookie(key) || 'autocollapse';
            $table.$toggle.on(M.tapEvent('click'),
                              $.proxy(toggleCollapsible, $table, key));
        } else {
            $table.$toggle.on(M.tapEvent('click'),
                              $.proxy(toggleCollapsible, $table, null));
        }

        if (collapse == 'collapsed' || (collapse == 'autocollapse' &&
                                        $table.siblings('table.collapsible').length)) {
            $table.addClass('collapsed').find('> tbody > tr:not(:first)').hide();
            $table.$toggle.text(expandCaption);
        } else {
            $table.$toggle.text(collapseCaption);
        }
    });

    /* タブ */
    $('.tab-list').each(function() {
        var $tabList = $(this),
            $tabContent = $tabList.nextAll('.tab-content'),
            $menu = $('<select>');
        $tabList.find('> ul > li').each(function() {
          var $tab = $(this),
              $menuitem = $('<option>');
          $menuitem.attr('value', $tab.data('tab'));
          $menuitem.text($tab.text());
          if ($tab.hasClass('current-tab')) {
            $menuitem.attr('selected', 'selected');
          }
          $menu.append($menuitem);
        });
        $tabList.append($menu);
        $menu.bind('change', function() {
            var index = $menu.val() - 1;
            $tabContent.hide().eq(index).show();
        });
    });

    /* 旧エケペディアへの言語間リンクで「_」を「%20」に置換する */
    M.on('language-overlay-initialize', function(options) {
        options.languages = options.languages.map(function(o) {
            if (o.lang === 'akb49') o.url = o.url.replace('_', '%20', 'g');
            return o;
        });
    });
});

});