WaniKani Profile Beautifier

Show numerical details instead of percentage on profile page
当前为 2017-12-03 提交的版本，查看最新版本。
换行
// ==UserScript==
// @name         WaniKani Profile Beautifier
// @namespace    https://www.wanikani.com
// @version      0.2.1
// @description  Show numerical details instead of percentage on profile page
// @author       polv
// @match        https://www.wanikani.com/users/*
// @grant        none
// ==/UserScript==

var color = {
    apprentice : '#E64CA3',
    guru : '#933BAB',
    master : '#4764DD',
    enlighten : '#3E9AE5',
    burned : '#000000'
};

(function() {
    'use strict';

    $.ajax({ // ajax call starts
      url: 'https://www.wanikani.com/api/user/' + localStorage.apiKey + '/srs-distribution',
      dataType: 'json', // Choosing a JSON datatype
    })
    .done(function(data) {
        var total_count = 0;
        $.each(data.requested_information, function(key, value){
            total_count += value.kanji;
        });

        var html_array = [];
        $.each(data.requested_information, function(key, value){
            html_array.push('<div class="bar-supplemental" style="text-align: right; float:left; width: ' + value.kanji/total_count*100 + '%; background-color:' + color[key] + '"><span class="beautifier_box"">'+ value.kanji + '</span></div>');
        });
        $('.kanji-progress .progress').html(html_array.reverse().join(''));

        total_count = 0;
        $.each(data.requested_information, function(key, value){
            total_count += value.vocabulary;
        });
        html_array = [];
        $.each(data.requested_information, function(key, value){
            html_array.push('<div class="bar-supplemental" style="text-align: right; float:left; width: ' + value.vocabulary/total_count*100 + '%; background-color:' + color[key] + '"><span class="beautifier_box"">'+ value.vocabulary + '</span></div>');
        });
        $('.vocabulary-progress .progress').html(html_array.reverse().join(''));
        
        var style = css($(".bar span"));
        console.log(style);
        
        $('.beautifier_box').css({
            'color':'white',
            'font-size':'12px',
            'margin': '0.5em',
            'text-shadow':'1px 1px black'
        });

    }).fail(function(err) {
	  	alert(err.code);
	});
})();

function css(a) {
    var sheets = document.styleSheets, o = {};
    for (var i in sheets) {
        var rules = sheets[i].rules || sheets[i].cssRules;
        for (var r in rules) {
            if (a.is(rules[r].selectorText)) {
                o = $.extend(o, css2json(rules[r].style), css2json(a.attr('style')));
            }
        }
    }
    return o;
}

function css2json(css) {
    var s = {};
    if (!css) return s;
    if (css instanceof CSSStyleDeclaration) {
        for (var i in css) {
            if ((css[i]).toLowerCase) {
                s[(css[i]).toLowerCase()] = (css[css[i]]);
            }
        }
    } else if (typeof css == "string") {
        css = css.split("; ");
        for (var i in css) {
            var l = css[i].split(": ");
            s[l[0].toLowerCase()] = (l[1]);
        }
    }
    return s;
}
欢迎访问Greasy Fork镜像
