// ==UserScript== // @name Mail.ru Filter News // @name:ru Mail.ru Фильтр новостей // @namespace https://github.com/AlekPet/ // @version 0.1 // @description Highlight or hide news // @description:ru Подсветка или скрытие новостей // @author AlekPet 2021 // @license MIT; https://raw.githubusercontent.com/AlekPet/Mail.ru-Filter-News/master/LICENSE // @icon data:image/svg+xml,%3Csvg viewBox%3D%220 0 95 32%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22 xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22 fill-rule%3D%22evenodd%22 clip-rule%3D%22evenodd%22 stroke-linejoin%3D%22round%22 stroke-miterlimit%3D%221.414%22%3E%3Cpath serif%3Aid%3D%2232_%40mail_w%22 fill%3D%22none%22 d%3D%22M0 0h95v32H0z%22%2F%3E%3CclipPath id%3D%22a%22%3E%3Cpath d%3D%22M0 0h95v32H0z%22%2F%3E%3C%2FclipPath%3E%3Cg clip-path%3D%22url(%23a)%22%3E%3Cpath fill%3D%22%23005ff9%22 d%3D%22M91.063 2.96h3.033v20.593h-3.033zM87.785 23.553h-3.033V8.96h3.033v14.593zM86.269 2.449a2.048 2.048 0 1 1-.001 4.095 2.048 2.048 0 0 1 .001-4.095zM81.475 23.553h-2.982v-1.596c-1.068 1.21-2.95 1.97-4.72 1.97a7.674 7.674 0 0 1-7.671-7.671 7.675 7.675 0 0 1 7.671-7.671c1.77 0 3.553.667 4.72 1.846V8.96h2.982v14.593zM73.87 11.651c2.61 0 4.664 1.868 4.664 4.605 0 2.738-2.054 4.622-4.664 4.622-2.611 0-4.595-2.011-4.595-4.622 0-2.61 1.984-4.605 4.595-4.605zM43.841 23.553H40.86V8.96h2.981v1.019c.662-.622 1.903-1.391 3.625-1.394 2.115 0 3.692.89 4.773 2.322 1.182-1.417 3.13-2.322 5.116-2.322 3.725 0 6.264 2.516 6.264 6.436v8.532h-2.981v-8.532a3.458 3.458 0 0 0-3.454-3.454 3.457 3.457 0 0 0-3.454 3.454v8.532h-2.981v-8.532a3.458 3.458 0 0 0-3.454-3.454 3.457 3.457 0 0 0-3.454 3.454v8.532z%22%2F%3E%3Cpath d%3D%22M20.813 16A4.818 4.818 0 0 1 16 20.813 4.818 4.818 0 0 1 11.187 16 4.818 4.818 0 0 1 16 11.187 4.818 4.818 0 0 1 20.813 16M16 0C7.178 0 0 7.178 0 16s7.178 16 16 16c3.232 0 6.349-.962 9.013-2.783l.046-.032-2.156-2.506-.036.024A12.672 12.672 0 0 1 16 28.72C8.986 28.72 3.28 23.014 3.28 16S8.986 3.28 16 3.28 28.72 8.986 28.72 16c0 .909-.101 1.829-.3 2.734-.402 1.651-1.558 2.157-2.426 2.09-.873-.071-1.894-.693-1.901-2.215V16c0-4.463-3.63-8.093-8.093-8.093S7.907 11.537 7.907 16s3.63 8.093 8.093 8.093a8.03 8.03 0 0 0 5.734-2.389 5.198 5.198 0 0 0 3.997 2.389 5.399 5.399 0 0 0 3.678-1.078c.959-.728 1.675-1.781 2.071-3.046.063-.204.179-.672.18-.675l.003-.017C31.896 18.262 32 17.25 32 16c0-8.822-7.178-16-16-16%22 fill%3D%22%23ff9e00%22 fill-rule%3D%22nonzero%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E // @match http*://mail.ru // @run-at document-end // @grant GM_addStyle // @grant GM_setValue // @grant GM_getValue // @downloadURL none // ==/UserScript== (function() { 'use strict'; GM_addStyle("\ .filter_item_box{opacity: 0;height: 0;transition: transform 5s, height 3s, opacity 1s;-webkit-transform:transform 5s, height 3s, opacity 1s;overflow: hidden;}\ .filter_item_box_show{opacity: 1;height: auto;}\ .filter_item_box > div {transform: translateX(100vw);-webkit-transform: translateX(100vw);}\ .filter_item_box.filter_item_box_show > div {transform: translateX(0);-webkit-transform: translateX(0);}\ \ .filter_class{display: inline-block;padding: 2px;user-select:none;cursor:pointer;margin: 8px 6px 3px 6px;font-family: monospace;transition: 0.5s all;box-shadow:0 2px 2px silver;border: 3px solid;text-align: center;}\ .filter_class:hover{transform: scale(1.1);}\ \ .filter_item{font-size: 10px;border-radius: 4px;line-height:1;}\ .filter_item:hover{background-color: #40ffa087;}\ \ .add_filter_item{border-width:1px;border-radius: 100%;font-size: 14px;width: 15px;height: 15px;line-height: 0.5;}\ .add_filter_item:hover{background-color: #005ff9a1;color:#fff;}\ \ .filter_item_hide_legend:after {content: 'H';color: red;position: absolute;display: inline-block;margin-top: -11px;padding: 2px;border: 1px solid;background: #ffffffc7;}\ .filter_item_hide{display:none;}\ \ .tabs__filter_button{position: relative;display: -webkit-inline-flex;display: inline-flex;height: 27px;background: url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9JzMwMHB4JyB3aWR0aD0nMzAwcHgnICBmaWxsPSIjMDAwMDAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMTAwIDEwMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMTAwIDEwMCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03Ni40MjgsMjguOTg4Qzc1LjQ2NSwzMy4wMjQsNjMuODU1LDQ1LjE4Niw1Ni41LDUyLjU3OVY3NC4zNmwtMTIsNi45MjhWNTIuNTc5ICBjLTcuMzU2LTcuMzk0LTE4Ljk2NS0xOS41NTUtMTkuOTI4LTIzLjU5MUMyNC41MjksMjguODI1LDI0LjUsMjguNjYyLDI0LjUsMjguNWMwLTMuODY2LDEyLjE5My04LDI2LThjMTMuODA3LDAsMjYsNC4xMzQsMjYsOCAgQzc2LjUsMjguNjYyLDc2LjQ3MSwyOC44MjUsNzYuNDI4LDI4Ljk4OHogTTUwLjUsMjMuNWMtMTIuMTUsMC0yMywyLjc5MS0yMyw1YzIsNSwyMCwyNCwyMCwyNHYyNGMyLTEsNC0yLDYtM3YtMjFjMCwwLDE4LTE5LDIwLTI0ICBDNzMuNSwyNi4yOTEsNjIuNjUsMjMuNSw1MC41LDIzLjV6IE02Mi41LDM5LjVjLTUuMzYzLDUuOTUtMTEuOTMsMTMtMTEuOTMsMTNzLTYuODYxLTcuMTk4LTEyLjA3LTEzICBDNDUuOTE3LDM5LjU4NSw1NS40MDcsMzkuNjEzLDYyLjUsMzkuNXoiPjwvcGF0aD48L3N2Zz4=);width: 27px;background-size: 27px;top: 5px;}\ .tabs__filter_button:after{\content: '';mix-blend-mode: screen;background: #000000;position: absolute;width: 100%;height: 100%;}\ .tabs__filter_button:hover:after, .tabs__filter_button.activefilter:after{background: #005ff9;}\ \ .tabs__filter_button_info {position: absolute;z-index:1;color: white;background: #005ff994;padding: 3px;left: 80%;top: -5px;border-radius: 3px;user-select: none;font-size: 10px;line-height: 1;box-shadow: 2px 2px 3px #c0c0c0eb;}\ "); var ObjMailNews = { filter_list: [] } function LS_save(){ var _tmp = JSON.stringify(ObjMailNews) if(_tmp){ GM_setValue('ObjMailNews', _tmp) } } function LS_load(){ var _tmp = GM_getValue('ObjMailNews') ObjMailNews = _tmp ? JSON.parse(_tmp) : ObjMailNews log(ObjMailNews) } function log(text){ console.log(text) } function rndcolor(type){ return type ? 'rgba('+Math.floor(Math.random()*255)+','+Math.floor(Math.random()*255)+','+Math.floor(Math.random()*255)+', 1.0)':'#'+Math.floor(Math.random()*16777215).toString(16) } function isColor(strColor){ var op = new Option().style; op.color = strColor; return op.color !== ''; } function addClassName(el,cls){ var all_class = el.className.split(' ') all_class.push(cls) return all_class.join(' ') } var NewsDown = function(){ var self = this this.decorateStyle = function(el, num){ var itemObj = ObjMailNews.filter_list[num]//el.dataset.myp ? JSON.parse(el.dataset.myp) : null if(itemObj && Object.keys(itemObj).length){ if(itemObj.hide){ if(!el.classList.contains('filter_item_hide')) el.classList.add('filter_item_hide') return; } if(itemObj.highlight){ var color = itemObj.highlight ? itemObj.highlight : rndcolor(), highlight = "background:"+ color +';' el.setAttribute("style", highlight) } } } this.findNews = function(mut, obs){ var news = document.querySelectorAll(".tabs-content__item"), itemObj = ObjMailNews.filter_list, fElements = news.forEach(function(el){ var t_content = el.textContent.toLowerCase() // Restore element if(el.hasAttribute('style')) el.removeAttribute('style') if(el.classList.contains('flter_item_hide')) el.classList.remove('flter_item_hide') // for(var z in itemObj){ if(t_content.includes(itemObj[z].title.toLowerCase())){ self.decorateStyle(el, z) } } }) } this.addItem = function(event){ var target = event.target var change = prompt('Введите значение: ') if(change && !/^\s*$/i.test(change)){ var color = prompt('Введите значение цвета (пусто случ. цвет, каждый раз):\n #000000 or rgba(255,0,0,1.0) or rgb(0,255,0)', 'random'), hide = prompt('Скрывать в новостной ленте?\n0 - нет\n1 - да','0') ObjMailNews.filter_list.push({ title: change, highlight: isColor(color) ? color : rndcolor(), hide: hide !== '1' ? 0 : 1 }) this.listUpd() this.findNews() LS_save(); } } this.clickItem = function(num, event){ var target = event.target, itemObj = ObjMailNews.filter_list[num], change = prompt('Введите значение: \ndel - удалить фильтр', itemObj.title) if(change && !/^\s*$/i.test(change)){ if(change !== 'del'){ var color = prompt('Введите значение цвета (пусто случ. цвет):\n #000000 or rgba(255,0,0,1.0) or rgb(0,255,0)', itemObj.highlight), hide = prompt('Скрывать в новостной ленте?\n0 - нет\n1 - да', itemObj.hide) itemObj.title = change itemObj.highlight = isColor(color) ? color : rndcolor() itemObj.hide = hide == null ? itemObj.hide : hide !== '1' ? 0 : 1 } else { ObjMailNews.filter_list.splice(num, 1) } this.listUpd() this.findNews() LS_save() } } this.listUpd = function(){ this.divBox.innerHTML = '' for(var z in ObjMailNews.filter_list){ var itemObj = ObjMailNews.filter_list[z], d = document.createElement("div") d.className = 'filter_class filter_item' d.textContent = itemObj.title d.title = 'Фильтр: '+d.textContent + (itemObj.hide?' (скрыть)':'') d.setAttribute("style", 'border-color:'+itemObj.highlight) if(itemObj.hasOwnProperty('hide') && itemObj.hide){ d.classList.add("filter_item_hide_legend") } d.addEventListener('click', this.clickItem.bind(this, z)) this.divBox.appendChild(d) } var addButton = document.createElement("div") addButton.className = 'filter_class add_filter_item' addButton.textContent = '+' addButton.title = 'Добавить фильтр' addButton.addEventListener('click', this.addItem.bind(this)) this.divBox.appendChild(addButton) this.filter_button_info.textContent = ObjMailNews.filter_list.length this.filter_button.title = 'Фильтр (Элементов: '+this.filter_button_info.textContent+')' } this.showhide = function(){ if(!this.divBox.classList.contains('filter_item_box_show')){ this.divBox.classList.add('filter_item_box_show') this.filter_button.classList.add('activefilter') } else { this.divBox.classList.remove('filter_item_box_show') this.filter_button.classList.remove('activefilter') } //this.divBox.style.display = this.divBox.style.display == 'block' ? 'none' : 'block' } this.init = function(){ LS_load() var config = { attributes: true, attributeFilter:["data-show-pixel"], //childList: true, //subtree: true }, tabs = document.querySelector(".tabs") this.divBox = document.createElement("div") this.divBox.classList.add('filter_item_box') this.filter_button = document.createElement("a") this.filter_button.href = '#' this.filter_button.title = 'Фильтр' this.filter_button.classList.add('tabs__filter_button') this.filter_button_info = document.createElement("div") this.filter_button_info.textContent = '...' this.filter_button_info.classList.add('tabs__filter_button_info') this.filter_button.appendChild(this.filter_button_info) this.listUpd() tabs.appendChild(this.filter_button) tabs.nextElementSibling.parentNode.insertBefore(this.divBox,tabs.nextElementSibling) this.filter_button.addEventListener('click', this.showhide.bind(this)) this.findNews() this.observer = new MutationObserver(this.findNews); this.observer.observe(document.querySelector(".tabs-content_atlas"), config); } } new NewsDown().init() })();