☰

Feedly Colorful Listview Mod

Feedly Colorful Listview Mod working with Chrome

当前为 2016-09-13 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name           Feedly Colorful Listview Mod
  3. // @id             FeedlyColorfulListviewMod
  4. // @version        0.0.8.20160913
  5. // @description    Feedly Colorful Listview Mod working with Chrome
  6. // @namespace      https://greasyfork.org/pl/users/66016-marcindabrowski
  7. // @match          *://*.feedly.com/*
  8. // @grant          GM_addStyle
  9. // @run-at         document-end
  10. // ==/UserScript==
  11. var ColorfulListView = function () {
  12. 	this.initialize.apply(this, arguments);
  13. };
  14.  
  15. ColorfulListView.prototype = {
  16. 	initialize:function () {
  17. 		this.colors = {};
  18. 	},
  19.     makeColor:function (str) {
  20. 		var h = 0;
  21.         for (var i = 0; i < str.length; i++) {
  22.             h += str.charCodeAt(i);
  23.         }
  24. 		return {"h":(h%36+1)*10, "s":30 + (h%5+1)*10};
  25. 	},
  26. 	color:function (item) {
  27. 		var itemid = item.id.replace(/^([^=]+).*$/, "$1");
  28. 		item.setAttribute("data-color", itemid);
  29. 		if (this.colors[itemid]!==undefined) return null;
  30. 		this.colors[itemid] = this.makeColor(itemid);
  31. 		GM_addStyle(
  32. 			"div[data-color='" + itemid + "'] {background:hsl(" + this.colors[itemid]['h'] + "," + this.colors[itemid]['s'] + "%,80%) !important;}"	+
  33.             "div[data-color='" + itemid + "']:hover {background:hsl(" + this.colors[itemid]['h'] + "," + this.colors[itemid]['s'] + "%,70%) !important;}"
  34. 		);
  35. 	}
  36. };
  37. var mo = new MutationObserver(function (mutations) {
  38. 	var colorfulListViewObj = new ColorfulListView();
  39. 	mutations.forEach(function (mutation) {
  40. 		Array.prototype.slice.call(mutation.addedNodes).forEach(function (node) {
  41. 			if (node.className===undefined || node.className.indexOf("u0Entry")==-1) return null;
  42. 			if (node.getAttribute("data-color")!==null) return null;
  43. 			colorfulListViewObj.color(node);
  44. 		});
  45. 	});
  46. });
  47. mo.observe(document.getElementById("box"), {childList:true, subtree:true});