EyeWire Stats - another TamperMonkey script

wooo yay ty! :smiley:

1 Like

Hey there

Just for a report, i sometimes have this little issue :

As you can see, a TB with a weight of 2. I already know the toolbox is a bit laggy so the fact there’s only my name if there’s already another player who played, is “normal”.

Hi,

Yeah, I know about the issue. It’s because the server usually refreshes weight of a cube after at least a couple of seconds and sometimes even after a minute or so. So, I do it this way, that I’m taking, what server serves me for that cube and add 1, when the cube was played or add 3, when the cube was scythed. However, sometimes it happens, that the server updates the weights right away and adding another +1 (+3) makes what you see on the screenshot. However, after each refresh from the server (those that happen every minute) the weight should be updated correctly, because then I don’t add anything manually.
I’ve decided to do it this way, because it’s much more common, that the weight wasn’t yet updated, that the weight is up to date.
However, Kelv added some additional things inside omni.js code, so I might use it to show the weight more correctly.

2 Likes

Cool ! Thanks for the explanation :slight_smile: So thanks, i can adapt my workflow now :slight_smile:

hey @KrzysztofKruk !
I made my custom new UI (not definitive) with the chrome’ dev tools, but i don’t know if i can save it and use it with tampermonkey ? (So for the moment i’m a bit afraid to refresh the tab :sweat:

All smaller, more simplist, specific colors to match my personal Win 7 etc etc
If you know how to, i’m open mind !

Hi,

Making it working through TamperMonkey should be easy.
Just create a new script with content similar to this:

// ==UserScript==
// @name         Name of your script
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Description of your script
// @author       Kfay
// @match        https://*.eyewire.org/
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    $('head').append(`<style>
         // your styles here
    </style>`);

    })();

Instead of the comment ("// your styles here") enter your custom styles int the format you see in the console, e.g.

if there’s:

body, button, textarea {
    font-family: Open Sans,sans-serif;
}

in the console, copy it and paste between those tags. If something desn’t work, you can try to add !important modifier after it, e.g.:

body, button, textarea {
    font-family: Open Sans,sans-serif !important;
}

It won’t work however, it you’ll try to add the first category from the Console, i.e. element.style. If you were modifying that part, you have to try to modify some other categories or try to find id or class of that element.
For example, if you’re modyfing the Overview Cell panel, its id is overviewCell (as you can see in the console), so to add a style to it, you should do it like this:

#overviewCell {
  /* your styles here */
}

If the element doesn’t have an id, but have a class, then you could do something like this:

.recall-arrow {
  /* your styles here */
}

Also you can check any online tutorials for creating CSS.

In the template at the beginning of the post, it’s important that I’m using there ticks (`) not apostrophes (’). The tick character it that one, which is usually to the left of “1” on the keyboard. It’s a new feature in JavaScript allowing creating multiline strings.

When you’re done with your script just save it, refresh EW page, edit the script and repeat those steps until everything works fine :wink: You don’t have to close the TamperMonkey dashboard or the opened script. Saving is enough to make changes work.

1 Like

Ohhh thanks @KrzysztofKruk !

I found a similar trick over the net which is :

function addGlobalStyle(css) {
var head, style;
head = document.getElementsByTagName(‘head’)[0];
if (!head) { return; }
style = document.createElement(‘style’);
style.type = ‘text/css’;
style.innerHTML = css;
head.appendChild(style);
}

Then i call the" addGlobalStyle" to get my css to work. it seem working fine too.

I will use yours and trying to make a new coool UI :slight_smile:

So the # is for div and . for class, i was wondering how to call those separately, now i know !
I did notice !important was to prioritize the value, but how if the initial autor already added !important to its value ?

I Finally will be able to minimize this UI and desaturate this dirty yellow OFF Mysti button for good ! :joy:
All your work, all your informations, answers… you rock man ! :grinning: Yeaaah yyeaaah you ROCK :sunglasses:

Cooopy/paste and Go

yeah, the addGlobalStyle() function should work almost the same way. I’ve done it my way to make it more readable.

is for ids, not divs. (Almost) every element can have an id and each id should be unique site-wise. Also (almost) every element can have one or more classes. Those don’t have to be unique and are often used to change style for a group of elements.

If author has already used !important then there’s also the priority of styles. The lowest priority have styles from a .css file, then styles from the section of a website, then from the “style” attribute of an element. iirc, changing styles from JS has even higher priority. In our case, we are adding styles to the section.
Also selectors have their priority. The selector is that part of a style before the opening curly brace.
E.g. “body” or “.className” or “#someId” are all selectors. But selectors can also be more complex, e.g. “#someId > div” or “#someOtherId table tr.someClass”. The more specific selector, the higher priority. The tag selectors (e.g. “body”, “div”, “span”, etc.) have the lowest priority, then the class selectors, then id selectors. When some more complex selectors are in use then there are also some priorities, but in those cases it’s usually more useful to just change and check :wink:
Some simple use of selector prioritizing is when you want to override a style for e.g. “div” selector. You can write “#idOfSomeOfTheDescendants div” and this selector will have higher priority.
If two styles have exactly the same priority (e.g. both are in a .css file and are constructed the same way) then the order of the selectors matters - styles from the last one are used (ofc, only those styles, which are changed by that style definition; those which aren’t changed by the last definition, are taken from the earlier ones or from some other definitions - whatever matches).

Not exactly a bug, but

I think you should -if possible- tie yours and HQ’s accuracy bars to the option in gear cog, so if I enable yours it hides HQ’s and visa versa, otherwise having yours on (which I assume to have yours on, means I don’t want HQ’s and visa versa) has both on lol.

1 Like

Yeah, I’ll do that soon and also fix the problem, that after turning off my version and refreshing the EW page, mine is still visible, despite the option being turned off.

2 Likes

Yeah don’t really know for you guys, but i prefer KK version. More visible (larger bars), weight cubes and % appearing.

I already made invisible and unclickable the new bars by adding

activityTrackerBarContainer>div>div.highAccuracy {
opacity: 0;
}

So don’t you just need to reactivate yours ? (i have not your since update)

I like HQ’s ones espec now that I found and changed the scythed colour to my scythe vision colour lol, but maybe b/c I have a large monitor they’re not as small here and I like that all 60 appear on same side of screen and don’t go over 2D lol.
Btw @KK how can I change your bars’ scythed colour? lol

I’ve so far left the other colours on it on default.

And thanks for all the work! :smiley:

I’ve pushed a quick workaround (ver. 1.5.2) for the Accu Chart being visible after turning it off and refreshing the page. There is probably some race condition, so I will have to take a closer look to that. For now, it works this way, that after a refresh, it’s visibile for about 2 seconds and then (usually) gone. It doesn’t look good, so I wil fix it ASAP, but for now, it have to be that way.

As for your question, @Nseraf to change the color of a scythed bar, go to line 776 and change the value for RP_COLOR constant. I know, the name of the constant is wrong and it will be fixed in future versions, but it is as it is xD. Also the SC_COLOR constant visible in the code doesn’t work. It was planned to show also scythe-completes, but I couldn’t find any handle to detect the completes and don’t think it would be very usable after all.

1 Like

Great, thank you!! :smiley:

1 Like

yw :slight_smile:

ver. 1.5.3
I have (hopefully) fixed the problem in a more civilized way, lol.
Now it displays either the built-in ActivityTracker or my AccuChart and everything should work also after refreshing.

1 Like

By my side, its still shows both when yours is enable.
But it’s ok when disable it, only official

Hmm, for me everything works.
However, I’ve changed the code a little bit (ver. 1.5.3.1) and now the built-in shouldn’t be displayed when mine is visible. Though, the official one may blink for a moment then disappear.

1 Like

Yeah, I like that too and was going to do mine this way. However, I’ve decided to make the dropdown, so even people with smaller resolutions can have use of the whole 60-cubes history.

1 Like

All is good now ! Thanks :slight_smile:

1 Like

Hey thanks for your help improving my knowledge in CSS !
here’s my new UI design :smiley:

I just can’t get rid of “Kfay” text weight and “Mystic info” button. But it’s almost perfect :slight_smile:

Do you think it would be possible to make the chat “auto hide” (hiding on the left) for the space to be unclickable ? Just an idea…