Author Topic: G Chrome Ext: Tampermonkey  (Read 2800 times)

rcjordan

  • I'm consulting the authorities on the subject
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 6709
  • Debbie says...
    • View Profile
G Chrome Ext: Tampermonkey
« on: September 17, 2016, 11:46:06 AM »
Once you start page hacking (incredibly easy with uBlock Origin) it's a very slippery slope.

https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo/related?hl=en

Note that TM docs mention the ability to sync your user files across all your chrome desktops. I went looking for that feature on UO just yesterday.

ergophobe

  • Inner Core
  • Hero Member
  • *
  • Posts: 3879
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #1 on: September 17, 2016, 07:45:21 PM »
Hmm....

How crazy can you get? Would I be able to use Tampermonkey to run a JQuery plugin on a page?

Example: there's an admin page for a Shopify app that has a product dropdown with all your products. This is completely unworkable. If I could just add in the Chosen plugin, it would make life so much easier.

https://harvesthq.github.io/chosen/

rcjordan

  • I'm consulting the authorities on the subject
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 6709
  • Debbie says...
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #2 on: September 17, 2016, 08:50:10 PM »
Seeing a comment while reading (hackernews, maybe) about something similar put greasemonkey back on the table for me. (I'd never heard of Tampermonkey until a day or so ago.)  The comment was about a user who was injecting scripts into late-90s government sites in order to make them usable.   Scroll down on this one.

http://stackoverflow.com/questions/20171383/how-to-use-a-jquery-plugin-in-greasemonkey-to-add-search-functionality-to-dro

rcjordan

  • I'm consulting the authorities on the subject
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 6709
  • Debbie says...
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #3 on: September 17, 2016, 09:02:36 PM »
<added>

At a quick glance, this one looks promising

http://hibbard.eu/tampermonkey-tutorial/

ergophobe

  • Inner Core
  • Hero Member
  • *
  • Posts: 3879
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #4 on: September 17, 2016, 10:16:41 PM »
Quote
http://stackoverflow.com/questions/20171383/how-to-use-a-jquery-plugin-in-greasemonkey-to-add-search-functionality-to-dro

Wow! Thanks. I guess it's getting pretty hard to come up with a "How do I...." question that has been answered on SO.

In the interim, I actually got an email from the owner of the offending site that motivated this question and he said he actually would have had the desired functionality done this week but for the fact that his wife had the poor manners of choosing this time to have their baby. Some people are so selfish.

Still, if he doesn't do it soon, this looks pretty easy (I'm building something for a friend that depends on this and I know his patience doesn't extend to 1000-item dropdowns so it's nice to know I have this option).


>>greasemonkey

Firefox only. Now with Tampermonkey, this can work with most browsers, which is easier than asking someone to switch to Firefox.

Great find. Thanks RC

rcjordan

  • I'm consulting the authorities on the subject
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 6709
  • Debbie says...
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #5 on: September 17, 2016, 10:43:40 PM »
Welcome.

BTW, there's a /r/ for greasemonkey that may have cheap freelance help if you're not prone to grinding it out yourself.

BTW2, I'm currently messing with injecting controls in forums, 'Mark as Unread'  down at the post's page bottom here, for instance.  So, if I go dark you'll know I screwed up, hhh.

ergophobe

  • Inner Core
  • Hero Member
  • *
  • Posts: 3879
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #6 on: September 17, 2016, 11:46:51 PM »
Holy Moly that was easy (mostly).

I installed Tampermonkey and then added in the Chosen plugin from a CDN. Took me a bit to first test whether TM scripts would have access to JQuery that was already on the page (it does), so not very efficient for my first attempt at this, but still. This is so easy.

Only thing I don't get how to do yet is include a background image in CSS. I think I probably need absolute URLs, but since I just grabbed the CSS from a CDN, I can't modify it... but I'm guessing I can add CSS later and override that with absolute URLs...

This is pretty amazing. I can't believe I can add progressive search to any annoyingly long dropdown on the web. The next one shouldn't take by 5 minutes (whitelist the URL, figure out the right selector and DONE).

This is cool.

ergophobe

  • Inner Core
  • Hero Member
  • *
  • Posts: 3879
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #7 on: September 18, 2016, 12:01:48 AM »
This is the code that makes those dropdowns usable. I simply couldn't navigate the choices before. Now it's a few seconds to find the option I want!

I owe you man!

Code: [Select]
// ==UserScript==
// @name         Tampermonkey Test
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        https://bundles.gaze.bo/*
// @grant        GM_getResourceText
// @grant        GM_addStyle
// @require https://cdnjs.cloudflare.com/ajax/libs/chosen/1.6.2/chosen.jquery.js
// @resource ChosenCssFile https://cdnjs.cloudflare.com/ajax/libs/chosen/1.6.2/chosen.css
// @resource ChosenSprite https://cdnjs.cloudflare.com/ajax/libs/chosen/1.6.2/chosen-sprite.png
// ==/UserScript==

(function() {
    'use strict';

    var ChosenCss = GM_getResourceText ("ChosenCssFile");
    GM_addStyle (ChosenCss);
    GM_addStyle (".chosen-container-single .chosen-single abbr, .chosen-container-single .chosen-single div b, .chosen-container-single .chosen-search input[type='text'], .chosen-rtl .chosen-search input[type='text'] {background-image: url('https://cdnjs.cloudflare.com/ajax/libs/chosen/1.6.2/chosen-sprite.png');}");
    $("select.form-control[name=bundle_id]").chosen();
    
    if (typeof jQuery == 'undefined') {
        //   alert('JQuery is not defined');
    }
    
if (typeof $ == 'function') {
// warning, global var
// alert('JQuery $ is a function');
}
})();

rcjordan

  • I'm consulting the authorities on the subject
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 6709
  • Debbie says...
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #8 on: September 18, 2016, 04:41:58 AM »
Code: [Select]
// ==UserScript==
// @name        th3core.com/talk/
// @namespace   http://th3core.com/talk/
// @include     http://th3core.com/talk/*
// @author      RC
// @version     0
// @description Add Mark As New/Unread on every thread page. NOTE that the forum software is buggy on the Unread part of this feature.
// @grant    none
// ==/UserScript==

//  Go through all urls on page, copy first one with 'markasread' to variable 'node'
var xpathResult = document.evaluate("(//a[contains(@href, 'markasread')])[1]", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
var node=xpathResult.singleNodeValue;

//Create styled link text and add anchor/url
var para0 = document.createElement("p");
var link = document.createElement('a');
link.href = node;
link.appendChild(document.createTextNode('Mark As New/Unread'));
link.style.fontSize = '125%';
para0.appendChild(link);


// Find place on page to insert created link and inject it before it
element = document.getElementsByClassName("nav")[6];
element.insertBefore(para0, element.childNodes[0]);

Heh! The above DIDN'T come so easy. I had to grind this out by trial & error.  Adds Mark As New/Unread to the bottom of a thread on th3core. NOTE that the forum software is buggy on the 'Unread' part of this feature and in some instances fails to add it to the Unread page. It does seem to always flag it as 'New'
« Last Edit: September 18, 2016, 12:40:04 PM by rcjordan »

ergophobe

  • Inner Core
  • Hero Member
  • *
  • Posts: 3879
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #9 on: September 18, 2016, 03:03:18 PM »
Doesn't surprise me that wasn't easy - I find anytime you deal with xpath, you may be in for pain.

Cool stuff though

rcjordan

  • I'm consulting the authorities on the subject
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 6709
  • Debbie says...
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #10 on: September 18, 2016, 03:46:16 PM »
I don't really code in js, I just hack together other people's code and string it together to get the logic I want.  So it takes me a lot of searching to find the chunks of code I can understand and modify.  I'd spent much of the day messing with writing/placing the link text and parsing anchor tags to get to the parameters of the forum code's nav links. THEN I ran across a snippet for the url rather than the anchor.
Code: [Select]
a[contains(@href That led to the xpath routine which wrote the url to a variable.  With that, it took 10 minutes to finish the script.

I wanted the mod because I regularly read threads here that I want to think about or research before I reply and I hate scrolling back to the top in order to unread it.

bill

  • Devil's Avocado
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 1248
  • Avast!
    • View Profile
    • Email
Re: G Chrome Ext: Tampermonkey
« Reply #11 on: September 18, 2016, 08:40:32 PM »
I had no clue about TamperMonkey either. This could get ugly... ;)

rcjordan

  • I'm consulting the authorities on the subject
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 6709
  • Debbie says...
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #12 on: September 28, 2016, 08:09:08 PM »
>ugly

The ugly part comes when you cannot avoid using a mobile browser with no userscript support. I have hammered the sites I read regularly into minimalist feeds (some with kw filtering) and it is a painful experience to use them when fully formed.

rcjordan

  • I'm consulting the authorities on the subject
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 6709
  • Debbie says...
    • View Profile
Re: G Chrome Ext: Tampermonkey
« Reply #13 on: January 24, 2018, 08:06:58 PM »
Quote

The ugly part comes when you cannot avoid using a mobile browser with no userscript support. I have hammered the sites I read regularly into minimalist feeds (some with kw filtering) and it is a painful experience to use them when fully formed.

So I've been forced to mostly use a phone for browsing during the last 2 weeks. It's horrific.

bill

  • Devil's Avocado
  • Global Moderator
  • Hero Member
  • *****
  • Posts: 1248
  • Avast!
    • View Profile
    • Email
Re: G Chrome Ext: Tampermonkey
« Reply #14 on: January 26, 2018, 06:43:04 AM »
Well, they have GreaseMonkey mostly working again with FF Quantum, and most of my scripts seem to still work. Haven't tested fully, but it's nice to think they won't have to be completely rewritten.

> mostly use a phone for browsing during the last 2 weeks

Why would anyone do that to themselves?