Hiding SAS totals on Decks of Keyforge
First off, I’d like to say I love decksofkeyforge.com it is a fantastic site that lets me do a lot of the things I’d want a collection manager to do, plus a very good marketplace. That said, many people myself included, feel that SAS totals tend to blind us. High SAS decks get all the plays while low SAS decks get overlooked. I am here to help you remove your blinders.
The above is not an Archon Competitive deck, even if it’s my highest SAS, and I’d like to stop looking it like it is.
SAS is good
As Stuart mentioned in the recent Call of Discovery episode: If you’re short on time and have a large collection, just trying your highest SAS deck has a much higher chance of yielding good results than trying a random deck in your collection.
But suppose you do have time, or don’t have a huge collection, then you don’t want to limit yourself to the top 5% of your decks by SAS. You should still definitely test those top 5%, but you can do more. I can say for myself that even though I know there are many low SAS decks in my collection that might perform way better than expected, I would never get to them without playing in SASCAP events. And even in SASCAP events, I tend to go for the cap even if a lower SAS deck might be better.
SAS also provide us with individual stats, called AERC, and those stats are affected by synergy and anti synergy just like the deck total, and those stats are excellent tools to quickly assess what the strengths and weaknesses of a deck are.
No SAS Total
I’ve wanted to hide SAS totals for a while now, but I had a hard time finding the right chrome plugin for the job, until today. Spend a good couple of hours fiddling with it until I managed to make it work the way I wanted it to. It is still not perfect, but it does what I need it to do in most cases.
If you want your DoK pages to look like that, please keep reading!
Make it so…
I will have two sections, one for the technically inclined that want to understand what I did and how I did it, so they can use the tool to modify other parts of DoK or even other sites. And one for people that just want to copy paste some text and have it work. Feel free to skip one or the other.
In either case, you’ll need the Custom Blocker chrome extension. I am sure there are similar plugins for other browsers, but you’ll have to figure that one out on your own. Sorry!
EDIT: CorayThan of decksofkeyforge.com was kind enough to add a class to the div we want to hide, which makes everything a whole lot easier!
New way using CSS and uBlock Origin
I’m having some issues with the Custom Blocker, so I decided to try uBlock Origin. It was very easy.
I click the element picker mode, then click the div I wanted to remove. Then there are two sliders and I move the right one all the way to the left and done.
If you go to dashboard and My Filters, it should look like this:
! 2020-11-21 https://decksofkeyforge.com
decksofkeyforge.com##.deck-top-contents
That was way easier than the Custom Blocker and seems to work more smoothly. I also believe this extension should be available in other browsers.
New way using CSS and Custom Blocker
Go to any page with decks, click the Custom Blocker icon and then add new rule.
If you click suggest and click the top part of the box, you’ll be able to find the name of the div:
DIV.deck-score-box
Either click it, or copy the above into the CSS field. Next we need to make a slight modification to the Target Sites URL in order for it to apply everywhere.
https://decksofkeyforge\.com/.*
The above is RegExp so you need to also check the Use RegExp under the URL field.
Lastly, chance the Condition to Block Anyway and save. That’s it. Done! And it will work on all pages on DoK.
Old way using xPath For the technically inclined
Custom Blocker has two ways to choose which elements to block, either by CSS or by xPath. For the CSS to work, the different elements need to have different classes, which seems not to be the case for DoK. So I went with the xPath option.
The first think I needed to do was find the right xPath to the DIVs I wanted to block, I could figure this out using the inspect element tool for chrome, but a much quicker way is using another chrome plugin, xPath Finder. Using this tool, you can click an element, and it will show you the xPath to the DIV on the bottom left of your screen.
I navigated to MyDecks page, and Using xPath Finder, I clicked the element directly inside the blue header of the first deck card, which yields the following xPath:
/html/body/div[1]/div/div[3]/div[2]/div/div/div[1]/div/div/div[1]/div
If I clicked on the second deck card, I get:
/html/body/div[1]/div/div[3]/div[2]/div/div/div[2]/div/div/div[1]/div
Easy to see that the second to last index is the one I want to iterate over, so I will be replacing it with a star, like so:
/html/body/div[1]/div/div[3]/div[2]/div/div/div[*]/div/div/div[1]/div
Now you can click the Custom Blocker, and add new rule to the site, which shows this dialog:
We’ll start by putting in the xPath we generated, we’ll need to switch from CSS to XPath, and then paste the above xPath in the field. The Suggest button only seems to work for CSS, which is why I had to use xPath Finder.
Next we’ll set it to Block Anyway, to not be limited to specific words showing in the DIV. It should now work when you save.
However, you’ll notice that the URL will only work if it is specifically for the URL:
https://decksofkeyforge.com/decks?owner=poet
This means it will not work if you start adding constraints like minimum creature count.
In order to make it more general, you’d need to check Use RegExp and then modify the URL:
https://decksofkeyforge\.com/decks.*
This would seem to work fine until you navigate to a specific deck, or try to show decks for sale. That was pretty much my process, and now I’ll move on to the non-technical section, from which you’ll also be able to get all the xPaths and URLs I used, or you can fiddle with it on your own and see what you come up with!
Old way using Xpath Non-technical section
After you installed the Custom Blocker, make sure it is visible in the toolbar. You can click the little puzzle icon to pin the Custom Blocker to the toolbar.
Now go to any page really, and click the Custom Blocked icon and Add new rule for Site.
Once you click on the new rule, a popup will show that looks like this:
Check the Use RegExp under the URL field, and then in the URL field insert:
https://decksofkeyforge\.com/decks\?.*owner=.*
In the Elements to Hide section, click XPath and then paste the following in the field:
/html/body/div[1]/div/div[3]/div[2]/div/div/div[*]/div/div/div[1]/div
Lastly click on Block Anyway under Condition and Save. This should work for any deck search in your own decks. You can test now.
You’ll need to do this 3 more times for 3 more rules, in order to cover some other pages, so you may want to give the rule a distinctive name. Let’s add one rule for decks for sale, and two rules for single deck pages.
Decks for sale URL:
https://decksofkeyforge\.com/decks\?.*forSale=true.*
Decks for sale xPath:
/html/body/div[1]/div/div[3]/div[2]/div/div/div[*]/div/div/div/div[1]/div[1]/div
Single deck SAS URL:
https://decksofkeyforge.com/decks/[a-zA-Z0-9-_]{36}
Single deck SAS xPath:
/html/body/div[1]/div/div[3]/div[2]/div/div[1]/div
And I personally wanted to hide the charts at the top of the single deck page, so URL is the same:
https://decksofkeyforge.com/decks/[a-zA-Z0-9-_]{36}
And the single deck Charts xPath is:
/html/body/div[1]/div/div[3]/div[1]/div[1]/div[*]
I foresee people encountering some issues with this, please feel free to contact me on discord for help! Use the #timeshapers channel, so if someone else is available, they might be able to help you, and also if someone else encounters the same issues they can find it more easily.
Oh and if anyone comes up with better xPaths or URL RegExp, feel free to share.
Sorting
Deck of Keyforge still sorts your decks by SAS, which might cause some inadvertent blindness, so might want to change the sort to Name or Date Added to completely eliminate the blindness.
Have fun with your newfound sight!
