Difference between revisions of "MediaWiki:Common.js"
Mscottmoore (talk | contribs) (Pinyin table highlighting) |
Mscottmoore (talk | contribs) |
||
Line 4: | Line 4: | ||
$(document).ready( function() { | $(document).ready( function() { | ||
− | $('#table-settings').append('<p>Show IPA <input type="checkbox" id="table-toggle-ipa"/> Show zhuyin <input type="checkbox" id="table-toggle-zhuyin"/> Show Wade-Giles <input type="checkbox" id="table-toggle-wade-giles"/></p>'); | + | $('#table-settings').append('<p>TEST Show IPA <input type="checkbox" id="table-toggle-ipa"/> Show zhuyin <input type="checkbox" id="table-toggle-zhuyin"/> Show Wade-Giles <input type="checkbox" id="table-toggle-wade-giles"/></p>'); |
$('.table-ipa').hide(); | $('.table-ipa').hide(); | ||
Line 10: | Line 10: | ||
$('.table-wade-giles').hide(); | $('.table-wade-giles').hide(); | ||
+ | //highlight row and col of hovered cell | ||
$('#pinyin-table td').hover( function() { | $('#pinyin-table td').hover( function() { | ||
− | $(this).addClass('table-highlight'); | + | if ($(this).children('div.table-pinyin').length) { |
− | + | $(this).addClass('table-highlight'); | |
− | + | $(this).siblings().addClass('table-highlight'); | |
− | + | var rowIndex = $(this).prevAll().length+1; | |
+ | $('#pinyin-table tr :nth-child('+rowIndex+')').addClass('table-highlight'); | ||
+ | }; | ||
}, function() { | }, function() { | ||
$('.table-highlight').removeClass('table-highlight'); | $('.table-highlight').removeClass('table-highlight'); | ||
}); | }); | ||
+ | //collapse column groups | ||
+ | $('th.col-a, th.col-e, th.col-o, th.col-i, th.col-u, th.col-v').hover( function() { | ||
+ | var thClass = 'col' + $(this).getAttribute('id').substr(0,2); | ||
+ | $('th.'+thClass).addClass('table-selected'); | ||
+ | }, function() { | ||
+ | $('.table-selected').removeClass('table-selected'); | ||
+ | }).click( function() { | ||
+ | var thClass = 'col' + $(this).getAttribute('id').substr(0,2); | ||
+ | $('#pinyin-table '+thClass).css('display','none'); | ||
+ | }); | ||
+ | |||
+ | //toggle showing ipa, zhuyin, wade-giles | ||
$('#table-toggle-ipa').click( function() { | $('#table-toggle-ipa').click( function() { | ||
if ($(this).prop('checked')) { | if ($(this).prop('checked')) { |
Revision as of 07:46, 9 January 2015
/* Any JavaScript here will be loaded for all users on every page load. */
/*pinyin table scripts*/
$(document).ready( function() {
$('#table-settings').append('<p>TEST Show IPA <input type="checkbox" id="table-toggle-ipa"/> Show zhuyin <input type="checkbox" id="table-toggle-zhuyin"/> Show Wade-Giles <input type="checkbox" id="table-toggle-wade-giles"/></p>');
$('.table-ipa').hide();
$('.table-zhuyin').hide();
$('.table-wade-giles').hide();
//highlight row and col of hovered cell
$('#pinyin-table td').hover( function() {
if ($(this).children('div.table-pinyin').length) {
$(this).addClass('table-highlight');
$(this).siblings().addClass('table-highlight');
var rowIndex = $(this).prevAll().length+1;
$('#pinyin-table tr :nth-child('+rowIndex+')').addClass('table-highlight');
};
}, function() {
$('.table-highlight').removeClass('table-highlight');
});
//collapse column groups
$('th.col-a, th.col-e, th.col-o, th.col-i, th.col-u, th.col-v').hover( function() {
var thClass = 'col' + $(this).getAttribute('id').substr(0,2);
$('th.'+thClass).addClass('table-selected');
}, function() {
$('.table-selected').removeClass('table-selected');
}).click( function() {
var thClass = 'col' + $(this).getAttribute('id').substr(0,2);
$('#pinyin-table '+thClass).css('display','none');
});
//toggle showing ipa, zhuyin, wade-giles
$('#table-toggle-ipa').click( function() {
if ($(this).prop('checked')) {
$('.table-ipa').show();
} else {
$('.table-ipa').hide();
};
});
$('#table-toggle-zhuyin').click( function() {
if ($(this).prop('checked')) {
$('.table-zhuyin').show();
} else {
$('.table-zhuyin').hide();
};
});
$('#table-toggle-wade-giles').click( function() {
if ($(this).prop('checked')) {
$('.table-wade-giles').show();
} else {
$('.table-wade-giles').hide();
};
});
});