Raw Source
FreeStyler / pro-spo.ru rejting-videokart ratio

// ==UserScript==
// @name         pro-spo.ru rejting-videokart ratio
// @namespace    http://pro-spo.ru/vse-o-kompyuterax-i-noutbukax/5366
// @version      0.2
// @description  Improve comparison table of http://pro-spo.ru/vse-o-kompyuterax-i-noutbukax/5366-rejting-videokart-2018-po-sootnosheniyu-czena-kachestvo
//
// @author       FreeStyler
// @copyright    2018, FreeStyler (https://openuserjs.org/users/FreeStyler)
// @license      GPL-2.0-only
// @updateURL    https://openuserjs.org/meta/FreeStyler/rejting-videokart_sort.user.js
// @supportURL   mailto:zanygamer@gmail.com
// @match        http://pro-spo.ru/vse-o-kompyuterax-i-noutbukax/5366*
// @grant        none
// @run-at       document-end
// @require      https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js
// require       file://path_to/rejting-videokart_sort.user.js
// ==/UserScript==

(function ($, undefined) {
    $(function(){

        'use strict';

        var
            cl = console.log,
            isset = function (e){ return typeof e == 'undefined' ? false : true;},
            toggled = 1,
        endvar;

        function toggle(){

        }

        let style = /*html*/`
            <style>
                .btn {
                    float: right;
                    background: url(http://pro-spo.ru/components/com_jcomments/tpl/default/images/jc_btnl.gif) no-repeat;
                    margin-right: 5px;
                    cursor: pointer;
                }
                .btn div {
                    margin: 0 -1px 0 0;
                    float: left;
                    background: url(http://pro-spo.ru/components/com_jcomments/tpl/default/images/jc_btnr.gif) 100% 0 no-repeat;
                }
                .btn button {
                    text-decoration: none;
                    height: 22px;
                    line-height: 22px;
                    font-size: 12px;
                    font-weight: bold;
                    padding: 0 5px;
                    border: none;
                }

            </style>
        `;
        $('head').append(style);

        let butr = '<button class=btn style="    margin: 0 -1px 0 0;float: right;background: url(images/jc_btnr.gif) 100% 0 no-repeat;">Toggle</button>';
        let but = '<div id="toggleR" class=btn><div><button>Toggle</button></div></div>';
        //let butr = '<div class="btn"  style="/* display:none; */"><div><a href="#" tabindex="8" onclick="return false;" title="Toggle">Toggle</a></div></div>';
        //let but = '<div id="comments-form-buttons">        <div class="btn" id="comments-form-send"><div><a href="#" tabindex="7" onclick="jcomments.saveComment();return false;" title="Отправить (Ctrl+Enter)">Отправить</a></div></div>    </div>';

        $(but).insertBefore($('#main_content table').eq(3).prev());
        let trs = [];

        //let i = 0;
        let $head;
        //let $tbody = $('#main_content table').eq(3).find('tbody');
        let $tbody = $('.contentpaneopen').eq(1).find('tbody').eq(1);
        let $0r = $tbody.clone();

        $.each($tbody.find('tr'), function(i){ //            cl(el); cl(k);

            if(i === 0){ $head = $(this).clone(); return;}

            let test = parseInt($(this).children().eq(1).html());

            if(isNaN(test)) return;

            let price = parseInt($(this).children().eq(3).html());

            let ratio = 0;

            //cl(test);            cl(ratio);

            if(isNaN(price)) return;
                ratio = (test/price).toFixed(2);

            $(this).append('<td>'+ ratio +'</td>');
            trs.push($(this));
        });

        trs = trs.sort(function(a, b){
            let c = parseFloat(a.children().eq(4).html());
            let d = parseFloat(b.children().eq(4).html());

            if(isNaN(c)) cl(a);
            if(isNaN(d)) cl(b);
            //if(isNaN(c)) c = 0;                if(isNaN(c) || isNaN(d)) return 0;
            //cl(c); cl(d);
            return c - d;

            //return a.h -b;

        }).reverse();
        //cl(trs);

        let insert = '';

        trs.forEach(function(el){
            insert+= el[0].outerHTML;
        });
        //cl($head);
        $head.append('<td><b>Соотношение качество/цена (больше - лучше)</b></td>');
        //cl($tbody);        cl($('#main_content table').eq(3).find('tbody'));

        //cl($('.contentpaneopen').eq(1).find('tbody'));
        //$('#main_content table').eq(3).find('tbody').html($head).append(insert);
        $tbody.html($head).append(insert);

        //let $new = $('#main_content table').eq(3).find('tbody').clone();
        let $new = $tbody.clone();
        //$('#main_content table').eq(3).find('tbody').html(head).append(insert);

        $('#toggleR').on('click', function(){
            if(toggled){
                toggled = 0;
                $tbody.html($0r)
            } else {
                toggled = 1;
                $tbody.html($new)
            }
        });

    });
})(window.jQuery.noConflict(true));