BombManual.com improvements

Improvements for the BombManual
当前为 2015-10-20 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name            BombManual.com improvements
// @version         1.02
// @description     Improvements for the BombManual
// @author          Hexterity
// @match           http://www.bombmanual.com/manual/1/html/index.html
// @grant           none
// @namespace https://greasyfork.org/users/18430
// ==/UserScript==

$(document).ready(function () {
    
    $.fn.changeElementType = function(newType) {
        var newElements = [];

        $(this).each(function() {
            var attrs = {};

            $.each(this.attributes, function(idx, attr) {
                attrs[attr.nodeName] = attr.nodeValue;
            });

            var newElement = $("<" + newType + "/>", attrs).append($(this).contents());

            $(this).replaceWith(newElement);

            newElements.push(newElement);
        });

        return $(newElements);
    };
   
    $('<div id="navigation" style="position:fixed;top:16px;left:16px;width: 256px;background:white;border:solid 2px #000;padding:2px"></div>').appendTo('body');
    
    $('.page-header-section-title').each(function () {       
        $('#navigation').append('<a class="navigation_item">' + $(this).html() + '</a><br />');
    });
    
    $('.navigation_item').click(function() {
        navigation_item = $(this).html();
        $('.page-header-section-title').each(function () {
            if (navigation_item == $(this).html()) {                
                $('html, body').animate({
                    scrollTop: $(this).offset().top
                });
            }
        });
    });
  
    $('.keypad-symbol-image').click(function() {
        src = $(this).attr('src');
        if ($(this).parent().hasClass('highlight')) highlight = false;
        else highlight = true;
        $('.keypad-symbol-image').each(function() {
            if (src == $(this).attr('src')) {
                if (highlight) $(this).parent().addClass('highlight');
                else $(this).parent().removeClass('highlight');
            }
        });
        column_highlighted = false;
        for (i = 1; i < 7; i++) {
            count = 0;
            $('body').find('.column_' + i).each(function () {
                if ($(this).hasClass('highlight')) count++;
                if (count == 4) {
                    for (j = 1; j < 7; j++) {
                        if (i != j) $('.column_' + j).addClass('greyed');
                    }
                    column_highlighted = true;
                }
            });
        }
        console.log('column_highlighted', column_highlighted);
        if ( ! column_highlighted) {
            for (i = 1; i < 7; i++) {
                if ($('.column_' + i).hasClass('greyed')) $('.column_' + i).removeClass('greyed');
            }
        }
    });
    
    keypad_column_count = 1;    
    $('body').find('.keypad-table-column').each(function() {
        $(this).addClass('column_' + keypad_column_count);
        keypad_column_count++;
        if (keypad_column_count == 7) keypad_column_count = 1;
    });
    
    $('body').append('<div id="reset_keypad" style="width: 128px;background:green;color:white">Reset</div>');
    keypad_table_position = $('.keypad-table').position();
    $('#reset_keypad').offset({top: keypad_table_position.top, left: keypad_table_position.left});
    $('#reset_keypad').click(function() {
       for (i = 1; i < 7; i++) {
           $('.column_' + i).removeClass('greyed').removeClass('highlight');
       }
    });
    
    $('.whos-on-first-step2-table th').each(function () {
        $(this).addClass('bold').changeElementType('td');
    });
    
    $('.whos-on-first-step2-table').css({background: 'white'});
    
    $('.whos-on-first-step2-table tbody').prepend('<tr class="sort"><th>Sort</th><td>Sort</td></tr>');
    
    $('.sort th, .sort td').click(function(){
        var table = $(this).parents('table').eq(0)
        var rows = table.find('tr:gt(0)').toArray().sort(comparer($(this).index()))
        this.asc = !this.asc
        if (!this.asc){rows = rows.reverse()}
        for (var i = 0; i < rows.length; i++){table.append(rows[i])}
    })
  
    $('body').append('<style>.highlight { background: green } .greyed { background: grey } .bold { font-weight: bold }</style>');
    
});

$(window).load(function () {
    
    var red_eclipse;
    var blue_eclipse;
    var star_eclipse;
    var led_eclipse;
    
    $('svg', $('#venndiagram')[0].contentDocument).find('ellipse').each(function (key) {
        
        console.log(key, $(this).attr('stroke-dasharray'));
        
        if (key == 0) red_eclipse = $(this);
        if (key == 1) blue_eclipse = $(this);
        if (key == 2) star_eclipse = $(this);
        if (key == 3) led_eclipse = $(this);
        
    });
        
    $('svg', $('#vennlegend')[0].contentDocument).find('text').each(function() {
        $(this).click(function() {
            
            button_text = $(this).find('tspan:first').html();
            
            console.log('click');
           
            if (button_text == 'Wire has red') toggleEclipse(red_eclipse);
            if (button_text == 'Wire has blue') toggleEclipse(blue_eclipse);
            if (button_text.indexOf('symbol') > 0) toggleEclipse(star_eclipse);
            if (button_text == 'LED is on') toggleEclipse(led_eclipse);
            
        });
    });
    
});

function comparer(index) {
    return function(a, b) {
        var valA = getCellValue(a, index), valB = getCellValue(b, index)
        return $.isNumeric(valA) && $.isNumeric(valB) ? valA - valB : valA.localeCompare(valB)
    }
}
function getCellValue(row, index){ return $(row).children('td').eq(index).html() }
function toggleEclipse(eclipse) {
    console.log(eclipse, eclipse.attr('fill'));
    if (eclipse.attr('fill') == 'none') eclipse.attr('fill', 'gray');
    else eclipse.attr('fill', 'none');
}