Script samples for Control Freak extension

procrastination_en.js

// Stop procrastination (a script for Control Freak extension)
// Paste this code into "Javascript" tab with a scope set to "All"
// @see https://chrome.google.com/webstore/detail/control-freak/jgnchehlaggacipokckdlbdemfeohdhc
var now = new Date();
if (now.getHours() >= 0 && now.getHours() < 6) {
    var defaultOverflow = getComputedStyle(document.body).overflow || "visible";
	document.body.style.overflow = "hidden";

	var overlay = document.createElement("div");
	overlay.style.background = "rgba(0, 0, 0, .85)";
	overlay.style.position = "fixed";
	overlay.style.width = "100%";
	overlay.style.left = 0;
	overlay.style.height = "100%";
	overlay.style.top = 0;
	overlay.style.textAlign = "center";
	overlay.style.zIndex = 1000;

	var advice = document.createElement("p");
	advice.innerHTML = "Now you can shut down your Chrome and have a rest.";
	advice.style.padding = "120px 0 24px";
	advice.style.color = "white";
	advice.style.fontSize = "24px";
	advice.style.textShadow = "0 0 2px white";
	overlay.appendChild(advice);

	var goFurther = document.createElement("button");
	goFurther.innerHTML = "No, I must work all night long!";
	goFurther.style.fontSize = "18px";
	goFurther.style.padding = "8px 12px";
	goFurther.style.cursor = "pointer";
	overlay.appendChild(goFurther);

	goFurther.onclick = function () {
		document.body.removeChild(overlay);
		document.body.style.overflow = defaultOverflow;
	};

	document.body.appendChild(overlay);
}

procrastination_ru.js

// Нет прокрастинации (скрипт для Control Freak)
// Вставьте этот код во вкладку "Javascript" с областью видимости "Везде"
// @see https://chrome.google.com/webstore/detail/control-freak/jgnchehlaggacipokckdlbdemfeohdhc
var now = new Date();
if (now.getHours() >= 0 && now.getHours() < 6) {
    var defaultOverflow = getComputedStyle(document.body).overflow || "visible";
    document.body.style.overflow = "hidden";

	var overlay = document.createElement("div");
	overlay.style.background = "rgba(0, 0, 0, .85)";
	overlay.style.position = "fixed";
	overlay.style.width = "100%";
	overlay.style.left = 0;
	overlay.style.height = "100%";
	overlay.style.top = 0;
	overlay.style.textAlign = "center";
	overlay.style.zIndex = 1000;

	var advice = document.createElement("p");
	advice.innerHTML = "Теперь питание компьютера можно отключить.";
	advice.style.padding = "120px 0 24px";
	advice.style.color = "white";
	advice.style.fontSize = "24px";
	advice.style.textShadow = "0 0 2px white";
	overlay.appendChild(advice);

	var goFurther = document.createElement("button");
	goFurther.innerHTML = "Нет, мне надо фигачить всю ночь!";
	goFurther.style.fontSize = "18px";
	goFurther.style.padding = "8px 12px";
	goFurther.style.cursor = "pointer";
	overlay.appendChild(goFurther);

	goFurther.onclick = function () {
		document.body.removeChild(overlay);
		document.body.style.overflow = defaultOverflow;
	};

	document.body.appendChild(overlay);
}

timing_api_en.js

// Timing API example (a script for Control Freak extension)
// Paste this code into "Javascript" tab with a scope set to "All"
// @see https://chrome.google.com/webstore/detail/control-freak/jgnchehlaggacipokckdlbdemfeohdhc
var interval = setInterval(function () {
    if (!performance.timing.loadEventEnd)
		return;

	clearInterval(interval);
	var elem = document.createElement("div");

	elem.style.position = "fixed";
	elem.style.right = 0;
	elem.style.bottom = 0;
	elem.style.zIndex = 1000;
	elem.style.background = "white";
	elem.style.fontSize = "16px";
	elem.style.padding = "8px";
	elem.style.border = "3px solid red";

	elem.innerHTML = "Network loading time: <b>" + (performance.timing.responseEnd - performance.timing.fetchStart) + "</b>ms";
	elem.innerHTML += "<br>Client loading time: <b>" + (performance.timing.loadEventEnd - performance.timing.responseEnd) + "</b>ms";
	elem.innerHTML += "<br>Total experience time: <b>" + (performance.timing.loadEventEnd - performance.timing.navigationStart) + "</b>ms";

	document.body.appendChild(elem);
}, 100);

timing_api_ru.js

// Пример работы Timing API (скрипт для Control Freak)
// Вставьте этот код во вкладку "Javascript" с областью видимости "Везде"
// @see https://chrome.google.com/webstore/detail/control-freak/jgnchehlaggacipokckdlbdemfeohdhc
var interval = setInterval(function () {
    if (!performance.timing.loadEventEnd)
    	return;

	clearInterval(interval);
	var elem = document.createElement("div");

	elem.style.position = "fixed";
	elem.style.right = 0;
	elem.style.bottom = 0;
	elem.style.zIndex = 1000;
	elem.style.background = "white";
	elem.style.fontSize = "16px";
	elem.style.padding = "8px";
	elem.style.border = "3px solid red";

	elem.innerHTML = "Время загрузки по сети: <b>" + (performance.timing.responseEnd - performance.timing.fetchStart) + "</b>ms";
	elem.innerHTML += "<br>Время загрузки клиентской части: <b>" + (performance.timing.loadEventEnd - performance.timing.responseEnd) + "</b>ms";
	elem.innerHTML += "<br>Общее время ожидания: <b>" + (performance.timing.loadEventEnd - performance.timing.navigationStart) + "</b>ms";

	document.body.appendChild(elem);
}, 100);

vk_com_music.js

// Пример скачивания музыки ВКонтакте (скрипт для Control Freak)
// Вставьте этот код во вкладку "Javascript" с областью видимости "Этот сайт" (vk.com)
// @see https://chrome.google.com/webstore/detail/control-freak/jgnchehlaggacipokckdlbdemfeohdhc
function addDwnldBtn() {
	[].forEach.call(document.querySelectorAll("div.audio:not(.controlfreaked)"), function (elem) {
		var hiddenId = elem.id.replace(/^audio/, "audio_info");
		var hiddenElem = elem.querySelector("#" + hiddenId);
		if (!hiddenElem)
			return;

		var downloadBtn = document.createElement("a");
		downloadBtn.setAttribute("href", hiddenElem.value.split(",")[0]);
		downloadBtn.setAttribute("download", elem.querySelector(".title_wrap").textContent.trim() + ".mp3");
		downloadBtn.setAttribute("title", "скачать");

		downloadBtn.onclick = function (evt) {
			evt.stopPropagation();
		};

		downloadBtn.style.display = "inline-block";
		downloadBtn.style.verticalAlign = "top";
		downloadBtn.style.cursor = "pointer";
		downloadBtn.style.width = "16px";
		downloadBtn.style.height = "16px";
		downloadBtn.style.background = "url(/images/playpause.gif) no-repeat 0 0";
		downloadBtn.style.webkitTransform = "rotate(90deg)";
		downloadBtn.style.marginLeft = "2px";

		var wrapper = elem.querySelector(".play_btn_wrap");
		var playBtn = wrapper.querySelector(".play_new");
		playBtn.style.display = "inline-block";
		playBtn.style.verticalAlign = "top";

		wrapper.appendChild(downloadBtn);

		var info = elem.querySelector(".info");
		info.style.width = "370px";
		
		elem.classList.add("controlfreaked");
	});
}

// загружать в начале
addDwnldBtn();

// и при "popstate" событии History API
window.addEventListener("popstate", addDwnldBtn, false);

vk_rss.js

var OVERLAY_CONTAINER_ID = "cf_overlay_rss";
var SYNC_STORAGE_KEY = "vk_rss_readitems";

chrome.storage.sync.get(SYNC_STORAGE_KEY, function (records) {
    var readItems = records[SYNC_STORAGE_KEY] || [];

    function removeOverlayRSS() {
        var feedWall = document.getElementById("feed_wall");
        if (feedWall) {
            feedWall.classList.remove("unshown");
        }

        var overlay = document.getElementById(OVERLAY_CONTAINER_ID);
        if (overlay) {
            overlay.remove();
        }
    }

    function addOverlayRSS() {
        var feedWall = document.getElementById("feed_wall");
        var overlay = document.getElementById(OVERLAY_CONTAINER_ID);
        if (overlay)
            return;

        var boundingRect = feedWall.getBoundingClientRect();

        overlay = document.createElement("div");
        overlay.id = OVERLAY_CONTAINER_ID;
        overlay.style.top = boundingRect.top + "px";
        overlay.style.left = boundingRect.left + "px";
        overlay.style.width = boundingRect.width + "px";

        document.body.appendChild(overlay);
        feedWall.classList.add("unshown");
    }

    function updateWrapperHeight() {
        var mainFeed = document.getElementById("main_feed");
        var overlay = document.getElementById(OVERLAY_CONTAINER_ID);

        mainFeed.style.height = mainFeed.clientHeight + overlay.clientHeight + "px";
    }

    function getItemsRSS() {
        var feed = document.getElementById("feed_rows");
        var output = [];

        [].forEach.call(feed.querySelectorAll(".feed_row"), function (feedRow) {
            var postContainer = feedRow.querySelector(".post");
            if (!postContainer) {
                return;
            }

            var postId = postContainer.id.replace(/^post/, "");
            var authorName = postContainer.querySelector(".author").textContent.trim();

            var postWPT = document.getElementById("wpt" + postId);
            var postContent = postWPT ? postWPT.textContent.trim().replace(/\s{2,}/g, " ") : "";
            
            var postDate = (feedRow.querySelector(".rel_date") || feedRow.querySelector(".published_by_date")).textContent;
            
            output.push({
                id: postId,
                author: authorName,
                content: postContent,
                date: postDate
            });
        });

        return output;
    }

    function obsCallback(records, obs) {
        //return;
        if (location.pathname !== "/feed" || location.search.length) {
            removeOverlayRSS();
            return;
        }

        addOverlayRSS();

        // collapse similar posts
        // this will cause new mutation to happen
        // 
        // document.title
        

        var rssItems = getItemsRSS();
        var overlay = document.getElementById(OVERLAY_CONTAINER_ID);

        rssItems.forEach(function (item) {
            var foo = overlay.querySelector("div[data-id='" + item.id + "']");
            if (foo)
                return;

            foo = document.createElement("div");
            foo.classList.add("item");
            foo.dataset.id = item.id;
            foo.setAttribute("onclick", "return showWiki({w: 'wall" + item.id + "'}, false, event)");

            foo.addEventListener("click", function () {
                console.log(item.id);
            }, false);

            var contentClassList = "item-title";
            if (readItems.indexOf(item.id) === -1) {
                contentClassList += " item-title-new";
            }
            
            foo.innerHTML = [
                "<div class='item-date'>" + item.date + "</div>",
                "<div class='item-author'>" + item.author + "</div>",
                "<div class='" + contentClassList + "'>" + item.content + "</div>"
            ].join("");

            overlay.appendChild(foo);
            
            // необязательно в конец, может быть новое
        });
        
        updateWrapperHeight();
    }

    (new MutationObserver(obsCallback)).observe(document.body, {
        childList: true,
        subtree: true
    });

    obsCallback();
});