Pimp my Numerama avec des userscripts đź’«

numeramhack
userscript
Tags: #<Tag:0x00007f15099580b0> #<Tag:0x00007f1509967f60>

#1

Aujourd’hui c’est la sortie de beta de deux scripts que j’ai faits il y a bien quelques mois maintenant pour rendre bien plus fonctionnel ce magnifique site :

Numerama Purity

S’exécute sur la partie Wordpress du site (les articles), il tire son nom de F.B. Purity et dispose de fonctions bien pratiques, paramétrables via le menu de Greasemonkey :

  • Accès direct aux commentaires sur Discourse
  • DĂ©sactivation du dĂ©filement infini (inifinite scroll)
  • Suppression des articles inclus
  • Suppression des articles liĂ©s en pied d’article
  • Suppression des Who’s who en fin d’article
  • Suppression du formulaire d’inscription Ă  la lettre d’information
  • Suppression des boutons de partage sur les rĂ©seaux sociaux
  • AutocomplĂ©tion email dans le formulaire de signalement d’erreurs

Numerama Discourse Vanilla

Comme son nom l’indique, s’exécute sur la partie Discourse de Numerama.

Il rend le forum enfin utilisable en forçant l’affichage du skin par défaut de Discourse sans les personnalisations de Numerama.


Pour les réfractaires à l’installation d’un userscript, voici un bookmarklet (manuel donc) :

javascript:(function()%7Bvar%20append%20%3D%20%22preview-style%3Dbe6b9932-2358-4de7-b7ed-974e57df4cd4%22%3Bif(location.toString().indexOf(append)%20%3C%200)%7Bif(location.toString().indexOf(%22%3F%22)%20%3E%20-1)%7Bappend%20%3D%20%22%26%22%2Bappend%3B%7Delse%7Bappend%20%3D%20%22%3F%22%2Bappend%3B%7Dlocation.replace(location%2Bappend)%3B%7D%7D)()

Changelog

  • 22/06/2016 : sortie de beta, Purity v1.3, Discourse Vanilla v1.1.
  • 23/06/2016 : Purity v1.4, avec suppression des articles inclus et des articles liĂ©s en pied d’article. Les options cosmĂ©tiques sont maintenant dĂ©sactivĂ©es par dĂ©faut (Ă  Ă©ventuellement rĂ©-activer lors d’une mise-Ă -jour)
  • 26/06/2016 : Purity v1.5, autocomplĂ©tion email dans formulaire de signalement d’erreurs
  • 10/07/2016 : Purity v1.6, suppression section Who’s who en fin de certains articles
  • 27/08/2016 : ajout d’un bookmarklet en alternative au userscript Discourse Vanilla
  • 30/08/2016 : Purity v1.7, option d’ouverture des liens externes dans l’onglet courant
  • 02/09/2016 : Purity v1.8, suppression boutons de partage sur rĂ©seaux sociaux, du formulaire d’abonnement Ă  la lettre d’information, nettoyage de code

Installation

NĂ©cessite Greasemonkey pour Firefox et Tampermonkey pour Chrome/ium.
Une fois l’extension rajoutée, il vous suffit d’un clic sur le .user.js qui vous intéresse et de cliquer sur “Installer”. Il est nécessaire de recharger les pages de Numerama concernées pour que le(s) script(s) s’y exécute(nt). Ces deux scripts se mettent automatiquement à jour.

Retours et demandes de fonctionnalités

N’hésitez pas à demander de nouvelles fonctions et des améliorations dans ce sujet. :thumbsup:
Les demandes de support et rapports de bugs peuvent se faire ici aussi.


Centralisation des bugs
Flux RSS des forums
Centralisation des bugs
C'est tout pourri
[Wiki] Liens utiles Discourse Numerama
Numerama en https
Enlever les articles non intéressants ? J'ai fait un script pour ça
#2

Sympa les scripts :slight_smile:


#3

Tu fais dans le phishing toi ?
https://code.numeramhack.fr/phishingkits/


#4

Non, mais je trouve ça intéressant : https://code.numeramhack.fr/phishingkits/README.txt


#5

OK, j'avais pas vu le readme :wink:


#6

GĂ©nial ! Merci.

:thumbsup:


#7

Merci.


#8

Nouvelle version 1.4 de Purity permettant de cacher les articles inclus dans le texte (exemple à la fin de celui-ci) ainsi que les articles liés en pied d’un article.

N’hésitez pas à me demander de cacher d’autres éléments sur les pages des articles (sauf la pub, il y a des extensions pour ça).


#9

Nouvelle version 1.5 de Purity permettant de compléter automatiquement l'adresse email dans le formulaire de signalement des erreurs avec celle configurée dans votre compte Discourse.


#10

Nouvelle version 1.6 de Purity permettant de cacher la section Who's who proéminente sous certains articles.


#11

Y’ a un truc que je comprends pas avec Discourse : on ne peut pas répondre dans un sujet sans mentionner une personne (répondre à un autre membre) ? Je vois pas de bouton répondre en bas des sujets. ???


#12

A priori faut répondre au premier message du sujet. C’est peut-être la seule fonctionnalité utile perdue avec Vanilla Discourse.
Je vois sur le forum de Korben qu’il y a un bouton répondre à la fin d’un sujet et sur le côté droit, sans doute parce que c’est une version plus à jour de Discourse. Ils sont en 1.6.0.beta10, on est en 1.5.1 (meta.discourse.org est en 1.6.0.beta10 aussi). Discourse 1.6 arrive en version stable fin juillet, un peu de patience le temps que Numerama soit mis à jour ensuite et on aura ça aussi je pense.


#13

Ok merci pour l' explication. :slight_smile:


#14

Ton sujet m’était passé sous le nez, je viens de le découvrir et ça marche du tonnerre ! Merci


#15

Peut-on modifier le css de la page directement avec greasemonkey ?

J'essaie d’obtenir un thème plus sombre un peu comme ici :

https://meta.discourse.org/t/its-a-dark-theme/15662
https://meta.discourse.org/t/really-simple-and-neat-dark-theme/46900

car je trouve le thème de base trop lumineux et pas assez contrasté.

J'ai fait quelques tests avec l'extention "Stylish" pour firefox, mais si je peux éviter de multiplier les extensions, ça m'arrange.


#16

Je sais que tu as dit que tu ne souhaitais pas cacher les pubs en vertu des extensions qui existent pour ça, en revanche serais-tu d’accord pour qu’on réutilise et modifie ton script, notamment pour cacher les “Articles liés” (le premier est maintenant une redirection cachée vers les autres sites d’Humanoid, et les autres sont en général des actus dépassées de plusieurs mois/années, et dont les titres sont souvent clickbait, pardon, servent à attirer l’utilisateur vers un contenu de qualité).


#17

Bonne idée je vais voir aujourd’hui @T82-135. Tu voudrais un menu (voir ci-dessous) avec un text-area pour y coller du CSS peut-être ? Tu pourrais me passer un CSS fonctionnel avec Stylish éventuellement s’il te plaît ?

C’est une option désactivée par défaut. Il faut cliquer sur le menu de Greasemonkey quand on est sur le Wordpress, puis sur Raccourcis du Script... puis Numerama Purity Config, et cocher l’option Disable links to related articles in footer. Recharger la page pour voir le changement.
Les raisons pour lesquelles j’ai rajouté cette option sont la plupart de celles dont tu parles (mais surtout parce que mon point d’entrée pour lire des articles c’est le forum et mes flux RSS).


#18

Owww je vois que tu as pensé à tout, merci !


#19

Je n'ai pas de CSS totalement adapté pour l'instant et vu que je ne connais rien dans le domaine, ça va me prendre un peu de temps.

Si un menu de ce type est simple a faire, oui ce serait parfait.
Ou sinon simplement intégrer le css dans le script.

Le look avec le style que j'ai récupéré sur le forum discourse :

Il faut encore corriger la couleur de certaines polices et zones du corps de page.

}
body
{
    background-color: #000000; 
    }

.topic-list {
    background: rgba(25, 25, 25, 0.9) 
}

.topic-list th {
    background: #222222;
    border-bottom: none
}

.nav-pills>li.active>a, .nav-pills>li>a.active {
    color: #dfdfdf;
    font-weight: 500;
    background-color: transparent; //matches main bg color
    border-bottom: 3px solid #9EB83B;
}
.logo-small, .logo-big {
    max-height: 60px !important;
    margin-top: -8px;
}
.topic-list>tbody>tr:first-of-type {
    border-top: 2px solid #9EB83B;
}
a.mention, a.mention-group {
    padding: 2px 4px;
    color: #000;
    background: #C0C0C0;
    border-radius: 5px;
    font-weight: bold;
    font-size: .93em;
}
#topic-closing-info {
    border-top: transparent;
    padding-top: 10px;
    height: 20px;
}

/*buttons*/

.list-controls .btn {
    float: right;
    margin-left: 8px;
    margin-bottom: 10px;
    font-size: 1.143em;
    font-weight: normal;
    background-color: #9EB83B;
}

/*Polls for dark themes*/

div.poll li[data-poll-option-id][data-poll-selected="selected"] {
    background: green !important;
}
div.poll .results .bar-back {
    background: grey;
}

/* topic post */
.topic-body {
    margin-top: 2px;
    margin-bottom: 1px;
    border: 1px solid #191919;
    background: rgba(25, 25, 25, 0.9)
}
/*Names*/
.names span.first {
    font-size: 1.02em;
}
/*admin borders*/
.admin-controls .nav.nav-pills li.active a {
    border-color: #9EB83B;
    background-color: transparent;

}

#20

Voici ce que j’ai pour l’instant, je n’en fais pas une release puisque ça risque de changer. Si tu arrives à un beau skin sombre il sera inclus dans un menu déroulant, on peut imaginer aussi une option qui change l’apparence claire/sombre en fonction de l’heure de la journée.
Tu as donc un menu accessible avec cette mĂŞme manipulation mais en Ă©tant sur Discourse permettant de coller de la CSS. Cliquer sur Save recharge la page avec tes modifications.

// ==UserScript==
// @name        Numerama Discourse Vanilla
// @namespace   liolfil
// @include     http://numerama.com/discussions/*
// @exclude     http://numerama.com/discussions/*.json*
// @exclude     http://numerama.com/discussions/*.css*
// @exclude     http://numerama.com/discussions/*.js*
// @exclude     http://numerama.com/discussions/uploads/*
// @exclude     http://numerama.com/discussions/*.png*
// @include     http://www.numerama.com/discussions/*
// @exclude     http://www.numerama.com/discussions/*.json*
// @exclude     http://www.numerama.com/discussions/*.css*
// @exclude     http://www.numerama.com/discussions/*.js*
// @exclude     http://www.numerama.com/discussions/uploads/*
// @exclude     http://www.numerama.com/discussions/*.png*
// @require     https://raw.githubusercontent.com/sizzlemctwizzle/GM_config/master/gm_config.js
// @run-at      document-start
// @version     1.2preview
// @updateURL   https://code.numeramhack.fr/userscripts/numerama-discourse-vanilla.user.js
// @downloadURL https://code.numeramhack.fr/userscripts/numerama-discourse-vanilla.user.js
// @grant       GM_getValue
// @grant       GM_setValue
// @grant       GM_registerMenuCommand
// @grant       GM_log
// @grant       GM_addStyle
// ==/UserScript==

var append = "preview-style=be6b9932-2358-4de7-b7ed-974e57df4cd4";
if(location.toString().indexOf(append) < 0){
    if(location.toString().indexOf("?") > -1){
        append = "&"+append;
    }else{
        append = "?"+append;
    }
    location.replace(location+append);
}

GM_registerMenuCommand('Numerama Discourse Vanilla Config', function(){
    GM_config.open()
});

GM_config.init({
    'id': 'GM_config', // The id used for this instance of GM_config
    'title': 'Numerama Discourse Vanilla configuration', // Panel Title
    'fields': // Fields object
    {
        'customCSS': // This is the id of the field
        {
            'label': 'Custom CSS', // Appears next to field
            'type': 'textarea', // Makes this setting a text field
            'default': '/* Enter your custom CSS here */' // Default value if user doesn't change it
        },
    },
    'events': // Callback functions object
    {
        save: function(values) {
            document.location.reload();
        }
    },
    'css': '#GM_config_field_customCSS {height:75%;width:100%;}'
});

var css = GM_config.get('customCSS');

if (typeof GM_addStyle != "undefined") {
    GM_addStyle(css);
} else if (typeof PRO_addStyle != "undefined") {
    PRO_addStyle(css);
} else if (typeof addStyle != "undefined") {
    addStyle(css);
} else {
    var node = document.createElement("style");
    node.type = "text/css";
    node.appendChild(document.createTextNode(css));
    var heads = document.getElementsByTagName("head");
    if (heads.length > 0) {
        heads[0].appendChild(node); 
    } else {
        // no head yet, stick it whereever
        document.documentElement.appendChild(node);
    }
}