Basecamp Keyword Highlighter

Highlights predefined list of keywords in the Basecamp task list at the beginning of task description

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Greasemonkey 油猴子Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Violentmonkey 暴力猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴Userscripts ,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey 篡改猴,才能安装此脚本。

您需要先安装一款用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

// ==UserScript==
// @name        Basecamp Keyword Highlighter
// @description Highlights predefined list of keywords in the Basecamp task list at the beginning of task description
// @include     https://*.basecamphq.com/projects/*/todo_lists
// @grant       none
// @version     0.5.3
// @namespace https://greasyfork.org/users/32141
// ==/UserScript==

// Here you can add your own keywords:
var keywordsColors = {
    // red
    'bf0303': ['error', 'bug'],

    // green
    '008c00': ['todo', 'feature'],

    // purple
    '5a00b3': ['postponed'],

    // pink
    'cc00ba': ['high']
};

function createKeywordStyles() {
    var color,
        style = document.createElement('style'),
        innerHtml = '.keyword {color: #fff; border-radius: 3px; padding: 0px 2px 0px 2px; }\n';

    for (color in keywordsColors) {
        innerHtml += '.keyword-' + color + ' { background-color: #' + color + '; }\n';
    }

    style.type = 'text/css';
    style.innerHTML = innerHtml;

    document.getElementsByTagName('head')[0].appendChild(style);
}

function processTodoLists(rootEl) {
    var el,
        child,
        color,
        regexps = {},
        keywords,
        tasksContent;

    function getType(obj) {
        return Object.prototype.toString.call(obj).replace('[object ', '').replace(']', '').toLowerCase();
    }

    function findElements(rootEl, tagName, param) {
        var result = [],
            elements = rootEl.getElementsByTagName(tagName),
            paramType = getType(param);

        for (var i = 0; i < elements.length; i++) {
            if (paramType == 'string' && elements[i].id.indexOf(param) === 0) {
                result.push(elements[i]);
            } else if (paramType == 'regexp' && param.test(elements[i].id)) {
                result.push(elements[i]);
            }
        }

        return result;
    }

    function formatTask(el, color, word) {
        el.innerHTML = el.innerHTML.replace(word, '<span class="keyword keyword-' + color + '">' + word + '</span>');
    }

    tasksContent = findElements(rootEl, 'span', /^item_wrap_/);
    for (var i = 0; i < tasksContent.length; i++) {
        el = tasksContent[i];
        child = el.firstChild;

        if (child.nodeName && child.nodeName.toLowerCase() == 'span' &&
            child.classList && child.classList.contains('keyword')) {
            continue;
        }

        var text = tasksContent[i].textContent;
        for (color in keywordsColors) {
            if (!keywordsColors.hasOwnProperty(color)) {
                continue;
            }

            keywords = keywordsColors[color];
            if (!regexps[color]) {
                regexps[color] = new RegExp('^((?:' + keywords.join('|') + ')[^:^\s]*).*', 'i');
            }

            var regexp = regexps[color];
            if (regexp.test(text)) {
                formatTask(tasksContent[i], color, regexp.exec(text)[1]);
                break;
            }
        }
    }
}

createKeywordStyles();

document.observe("dom:modified", function(ev) {
    processTodoLists(ev.target);
});
processTodoLists(document);