Resultate von Metager in drei visuell intuitiv isolierbare Elemente teilen und mit zusätzlichen Personalisierungs-Möglichkeiten versehen.
// ==UserScript==
// @name MetaGer_3.1
// @namespace http://metaget.de/
// @version 1.0
// @description Resultate von Metager in drei visuell intuitiv isolierbare Elemente teilen und mit zusätzlichen Personalisierungs-Möglichkeiten versehen.
// @author Mikki
// @match https://metager.de/*
// @grant GM_getValue
// @grant GM_setValue
// @grant GM_log
// @run-at document-start
// ==/UserScript==
(function() {
'use strict';
//////////////////////////////////////////////////////////////////////
// CSS //
//////////////////////////////////////////////////////////////////////
const cssInject = `
a.title {
color: #1900e6 !important;
font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
letter-spacing: 0.3px;
font-size: 18px !important;
font-weight: normal !important;
}
.link-link > a {
color: #a90707 !important;
font-size: 14px;
letter-spacing: 0.3px;
}
.description{
color: gray !important;
font-size: 12px !important;
}
.proxy, .number {
opacity: 0.4;
}
.link:hover .proxy{
opacity: 0.8;
}
.result {
margin-bottom: 20px;
}
.verstecken, .hervorheben {
font-size: 14px;
display: inline-block;
cursor: pointer;
margin-left: 5px;
opacity: 0.4;
}
.verstecken:hover, .hervorheben:hover {
color: blue;
}
.link:hover .verstecken, .link:hover .hervorheben{
opacity: 0.8;
}
.versteckt {
opacity: 0.1;
}
.zeigen {
width: 100%;
text-align: right;
opacity: 0.1;
}
.zeigen:hover {
opacity: 0.5;
}
.besonders a.title {
background-color: yellow;
}
`;
//////////////////////////////////////////////////////////////////////
// HTML //
//////////////////////////////////////////////////////////////////////
const hideButton = document.createElement('div');
hideButton.innerHTML = `
<div class="verstecken">verstecken</div>
`;
const unhideButton = document.createElement('div');
unhideButton.innerHTML = `
<div class="zeigen">domain zeigen</div>
`;
const highlightButton = document.createElement('div');
highlightButton.innerHTML = `
<div class="hervorheben">markieren</div>
`;
//////////////////////////////////////////////////////////////////////
// CODE //
//////////////////////////////////////////////////////////////////////
const ban = function(d){
banned.add(d);
GM_setValue('banned', Array.from(banned) );
GM_log('banning domain: '+d);
rows(d).forEach( v=>hide(v) );
}
const unban = function(d){
banned.delete(d);
GM_setValue('banned', Array.from(banned) );
GM_log('unbanning domain: '+d);
rows(d).forEach( v=>unhide(v) );
[...document.querySelectorAll('[data-domain="'+d+'"]')].forEach(v=>v.remove());
}
const promote = function(d){
specials.add(d);
GM_setValue('specials', Array.from(specials) );
GM_log('promoting domain: '+d);
rows(d).forEach( v=>highlight(v) );
}
const demote = function(d){
specials.delete(d);
GM_setValue('specials', Array.from(specials) );
GM_log('demoting domain: '+d);
rows(d).forEach( v=>unhighlight(v) );
}
const toggle_promote = function(d){
if( specials.has( d ) )
{
demote(d);
}
else
{
promote(d);
}
}
const rows = function(d){
return [...document.querySelectorAll('.result')].filter( (v)=>domain_of(v)==d );
}
const domain_of = function(x){
return x.querySelector('.link a').href
.slice(8)
.split('/')[0]
.split('.')
.slice(-2)
.join('.');
}
const hide = function(x){
x.classList.add('versteckt');
let h = domain_of(x);
let b = unhideButton.firstElementChild.cloneNode(true);
b = document.querySelector('.resultContainer').insertBefore( b, x );
b.dataset.domain = h;
b.onclick = (e)=>{
unban( h );
}
}
const unhide = function(x){
x.classList.remove('versteckt');
};
const highlight = function(x){
x.classList.add('besonders');
}
const unhighlight = function(x){
x.classList.remove('besonders');
}
const banned = new Set( GM_getValue('banned', new Array) );
const specials = new Set( GM_getValue('specials', new Array) );
/**
* SETUP CODE..
* > insert css into head
* > filter loaded rows
*/
document.head.appendChild( document.createElement('style') ).innerHTML = cssInject;
document.addEventListener( 'DOMContentLoaded', function(){
for( let x of [...document.querySelectorAll('.result')] )
{
let h = domain_of(x);
let b = x.querySelector('.link')
.appendChild( hideButton.firstElementChild.cloneNode(true) );
let c = x.querySelector('.link')
.appendChild( highlightButton.firstElementChild.cloneNode(true) );
b.onclick = (e)=>ban( h );
c.onclick = (e)=>toggle_promote( h );
if( banned.has( h ) )
{
hide(x);
}
if( specials.has( h ) )
{
highlight(x);
}
}
for( let x of [...document.querySelectorAll('.ad')] )
{
x.remove();
}
});
})();