Roukys / HHauto

GNU General Public License v3.0
45 stars 44 forks source link

Location of PowerCalc Information #715

Closed UncleBob800 closed 1 year ago

UncleBob800 commented 1 year ago

Can you please change the location of the win chance info as well as the corresponding icons? These elements are currently drawn in the same block as the squad element icon. image Because of this, not only does the icon itself move a lot, in addition it conflicts very much with the HH ++ OCD script. image

Previously, I myself transferred these elements through a user style to the place where the attack button is located. But after a recent update, this method of mine is broken. Please, can you move the output block of this information to "Perform x1" button block (seriously, who needs the text of this button at all? those who use this script know that this is an attack button, the text can be removed, and instead display the chance of victory and the corresponding icons)

image image P.S. I write a response to messages in advance, like "why don't you turn off this information in HH ++ or in this script", no, I need both of these indicators to work simultaneously, because. this helps to better determine the chances of winning, because each script has its own calculation algorithm and, as you can see in the screenshot, the numbers are often different.

tsokh commented 1 year ago

@UncleBob800 Here's a small hack - the only side problem is that replaced buttons adjust width from new div replacement, so they're smaller. Replace: if (doDisplay) { $('.player-team .icon-area',opponents[index]).prepend('<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${nRounding(100*simu.win, 2, -1)}%</div>'); }

with the following: if (doDisplay) { $('.player-panel-buttons .btn_season_perform',opponents[index]).contents().filter(function() {return this.nodeType===3;}).remove(); $('.player-panel-buttons .btn_season_perform',opponents[index]).find('span').hide(); $('.player-panel-buttons .btn_season_perform',opponents[index]).prepend('<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${nRounding(100*simu.win, 2, -1)}%</div>'); }

Small adjustments can be made to block display for better visuals: GM_addStyle('.matchRatingNew {'

deuxge commented 1 year ago

Sorry but what is the other script you are using ? I don't have the issue image

Dimka2010 commented 1 year ago

only bot script. Screenshot_6

bot + OCD Screenshot_7 Screenshot_8

so.. stop using another scripts. we inform you about this :) Screenshot_9

UncleBob800 commented 1 year ago

I made a little mistake with the HH++ version. I have HH++ from Numbers installed. image These are the only two scripts currently included.

UncleBob800 commented 1 year ago

For convenience, I made my edits to the latest version of the script, so that it would be easier to compare the original file with the modified one in order to understand what was changed and where HHAuto.user.js.txt

deuxge commented 1 year ago

Thanks for the help to change this position. Did you tested the behavior on smaller device / screen size ? I'm not against it if other agrees.

I'm not really ready to start making change to support HH++ BDSM. I tested it and it change a lot the UI. I agree, there is many good thing inside it. But it will add a lot of workload to harmonize both scripts. From what I understood the only officially allowed script (by the game) is the HH++ OCD. Maybe it changed. So I'm fine to support the one allowed by the game. I'm less about supporting others. (We can't support everything). For sure I'm against supporting other automated script.

What the other thinks about it ? @Roukys ? @OldRon1977 ?

Dimka2010 commented 1 year ago

For sure I'm against supporting other automated script. +1

better to pick from this scripts good ideas\solutions and to add in our bot :)

OldRon1977 commented 1 year ago

Hi all :) I am at vacations at the moment, so I am typing on my phone and Infos are dumped from my brain ;)

The OCD, BDSM and even the booster detector script are officially allowed, since they only do visual stuff and no automation. Except the page refresh, but this was ok for Kinkoid.

I personally would advise to support only one script in addition to ours. Because it will be a nightmare to maintain ;)

I used BDSM for a while and switched back to OCD. I think it was because OCD is better maintained and faster with updates, but this might have changed.

Both script are a nice add on. So I am fine with any decision. But please only one script. I have a slight preference towards OCD since we already support it.

I hope that helped :D

tsokh commented 1 year ago

@deuxge both OCD and BDSM are officially allowed (see kinkoid forum topic) - personally I like more BDSM style tweaks than OCD since the UI is more structured and simplified so it's easy to use for some manual tasks. It's fine to support only one script

UncleBob800 commented 1 year ago

For sure I'm against supporting other automated script. +1

better to pick from this scripts good ideas\solutions and to add in our bot :)

Wait, but HH++ BSDM is not an automation script... it seems to me, or do you not understand the situation? Or is it revenge? In any case, I don't think stealing other people's code is a good idea.

UncleBob800 commented 1 year ago

@OldRon1977 Personally, I prefer the BSDM version of HH++ because the developer has his own discord server and is much easier to contact than Tom. In addition, I just switched to BSDM due to the fact that Tom updated his OCD more slowly. In general, both OCD and BSDM are based on the same HH ++, in fact, BSDM is just an offshoot of OCD. They often copy from each other, so these scripts are functionally similar (although useful features and other visual improvements appeared in BSDM earlier). For all the time I have been using BSDM, I have not had a conflict between HHAuto and HH ++ BSDM, except perhaps the output of PowerCalc information, this is the only case of visual conflict that I remember, but for myself I did a solution to this problem through a user script launched through the Stylus plugin. In terms of the functioning of this script and yours, I did not observe any conflicts, again because HH ++ BSDM is based on HH ++ OCD, its visual interface just looks a little different. I even remember that HH++ BSDM had the booster panel before HH++ OCD. Tom then copied (presumably with permission from Numbers) the code for displaying the booster bar into his HH++ OCD. This suggests that they collaborate from time to time.

UncleBob800 commented 1 year ago

@deuxge both OCD and BDSM are officially allowed (see kinkoid forum topic) - personally I like more BDSM style tweaks than OCD since the UI is more structured and simplified so it's easy to use for some manual tasks. It's fine to support only one script

In general, based on my personal observations, if you make support for HH++ BSDM, then this will automatically be support for HH++ OCD. These two versions of HH++ have a lot in common, against the background of the BSDM version, the OSD looks like a kind of lite version of HH++. So support will work for both HH++ variants.

deuxge commented 1 year ago

Wait, but HH++ BSDM is not an automation script... it seems to me, or do you not understand the situation? Or is it revenge? In any case, I don't think stealing other people's code is a good idea.

I don't said it is an automation script. From my message I was talking about other script.

I don't have the same display as you on my season fights... I don't have this blue and green border... Look at my screenshot above, this seems not bad... Do you still have a style plugin active ?

Even with both, I don't have the same image

Seems we can find a solution but honestly, I'm not a fan of puting it on the button. itself. But if the other agrees, why not.

UncleBob800 commented 1 year ago

I don't said it is an automation script.

@deuxge That message was not addressed to you, but to Dimka2010 (there was even a quote to his message in my message), he mistakenly called HH++ BSDM an automation script.

What about the border around the icon of the element - yes, this is a my user style in Stylus that I made to better show which element dominates which element (yes, there are arrows on the icon itself showing this, but they are very hard to see, so I made my own user style in the form of a border around the icon with the appropriate colors, completely made in CSS, in other words, these borders will not affect scripts in any way) image

Seems we can find a solution but honestly

Well, above I indicated my code, which transfers PowerCalc information inside the button. Personally, everything works without failures for me (just in case, I even turned off Stylus and all other plugins, except for HHAuto). image

UncleBob800 commented 1 year ago

@tsokh @deuxge Contributed the code to the current version of the script. HHAuto_5_11_5.txt Works correctly with both BDSM and OCD versions.

In OCD version: image

OldRon1977 commented 1 year ago

Looks good 😊 Let's keep it this way, and it works with OCD and BDSM so a win-win.

UncleBob800 commented 1 year ago

@tsokh @deuxge HHAuto_5_11_8.txt

UncleBob800 commented 1 year ago

@tsokh @deuxge Introduced finished code in the latest(https://github.com/Roukys/HHauto/issues/719) update: HHAuto_5_11_9.txt

deuxge commented 1 year ago

Done in 5.13.0

UncleBob800 commented 1 year ago

A small improvement.

Even before I started doing the PowerCalc repositioning code, I noticed that the mobile view of the League was not displaying PowerCalc information. Then I did not attach any importance to this, but now I decided to experiment a little and I managed to display this information there. The solution turned out to be very simple.

Replace this:

        const pointText = `${nRounding(100*simu.win, 2, -1)}% (${nRounding(expectedValue, 1, -1)})`;
        $('div#leagues_right .leagues_team_block  .challenge .blue_button_L').prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${pointText}</div>`);

        if($('tr.lead_table_default td span.nickname span.OppoScore').length > 0) {
            $('tr.lead_table_default td span.nickname span.OppoScore').remove();
        }

this:

        const pointText = `${nRounding(100*simu.win, 2, -1)}% (${nRounding(expectedValue, 1, -1)})`;
        $('div#leagues_right .leagues_team_block  .challenge .blue_button_L').prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${pointText}</div>`);
        $('[hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn]').prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${pointText}</div>`);
        $('.leagues_team_block .challenge button>[class*="_icn"], [hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn] .energy_challenge_icn').remove();

        if($('tr.lead_table_default td span.nickname span.OppoScore').length > 0) {
            $('tr.lead_table_default td span.nickname span.OppoScore').remove();
        }

Replace this:

        GM_addStyle('.leagues_team_block .challenge button {'
                    + 'width: 160px; '
                    + 'color: transparent;}}'
                   );

this:

        GM_addStyle('.leagues_team_block .challenge button, [hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn] {'
                    + 'width: 160px; '
                    + 'color: transparent;}}'
                   );

And replace this:

        GM_addStyle('@media only screen and (max-width: 1025px) {'
                    + '.matchRatingNew {'
                    + 'text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000; '
                    + 'line-height: 17px; '
                    + 'font-size: 14px;}}'
                   );

this:

        GM_addStyle('@media only screen and (max-width: 1025px) {'
                    + '.matchRatingNew {'
                    + 'position: absolute;'
                    + 'width: auto;'
                    + 'display: flex;'
                    + 'flex-wrap: nowrap;'
                    + 'align-items: center;'
                    + 'justify-content: center;'
                    + 'text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000; '
                    + 'line-height: 17px; '
                    + 'font-size: 14px;}}'
                   );

And since there is this line:

$('.leagues_team_block .challenge button>[class*="_icn"], [hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn] .energy_challenge_icn').remove();

...then you can delete this block:

        GM_addStyle('.leagues_team_block .challenge button>[class*="_icn"] {'
                    + 'opacity: 0;}}'
                   );

Showing the result: image image

However, but I'm not sure if it's optimal to do this:

$('div#leagues_right .leagues_team_block  .challenge .blue_button_L').prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${pointText}</div>`);
$('[hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn]').prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${pointText}</div>`);

...or could it have been written in a more optimized way?

UncleBob800 commented 1 year ago

I also wanted to get advice from more knowledgeable in JS. Is it possible to somehow specify a command to delete text that exists as a separate element? image So far, I've only changed the color to transparent, but ideally need remove these elements as unnecessary. I know how to remove an icon because I know its selector. But I don't know how to remove the text element.

tsokh commented 1 year ago

@UncleBob800 example in jquery for textnode: $('.player-panel-buttons .btn_season_perform',opponents[index]).contents().filter(function() {return this.nodeType===3;}).remove(); for span: $('.player-panel-buttons .btn_season_perform',opponents[index]).find('span').hide();

UncleBob800 commented 1 year ago

@tsokh Thank you. Used your fixes, buttons look better now. Below is the change in the code.

Replace this:

            //matchRating = matchRating.substring(1);

            GM_addStyle('.green_button_L.btn_season_perform, .leagues_team_block .challenge button.blue_button_L {'
                    + 'width: 200px !important;'
                    + 'color: transparent;'
                    + 'line-height: 0px;'
                    + 'background-image: linear-gradient(to top,#008ed5 0,#05719c 100%);'
                    + '-webkit-box-shadow: 0 3px 0 rgb(13 22 25 / 35%), inset 0 3px 0 #6df0ff;'
                    + '-moz-box-shadow: 0 3px 0 rgba(13,22,25,.35),inset 0 3px 0 #6df0ff;'
                    + 'box-shadow: 0 3px 0 rgb(13 22 25 / 35%), inset 0 3px 0 #6df0ff;}'
                   );

            GM_addStyle('#season-arena .matchRatingNew {'
                    + 'width: 100%;'
                    + 'display: flex;'
                    + 'align-items: center;'
                    + 'justify-content: space-between;}'
                   );

            $('.player-panel-buttons .opponent_perform_button_container .green_button_L.btn_season_perform .energy_kiss_icn.kiss_icon_s').remove();

            if (doDisplay)
            {
                $('.player-panel-buttons .opponent_perform_button_container .green_button_L.btn_season_perform',opponents[index]).prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${nRounding(100*simu.win, 2, -1)}%</div>`);
            }

this:

            //matchRating = matchRating.substring(1);

            GM_addStyle('#season-arena .opponents_arena .opponent_perform_button_container {'
                    + 'width: 200px;}'
                   );

            GM_addStyle('.green_button_L.btn_season_perform, .leagues_team_block .challenge button.blue_button_L {'
                    + 'background-image: linear-gradient(to top,#008ed5 0,#05719c 100%);'
                    + '-webkit-box-shadow: 0 3px 0 rgb(13 22 25 / 35%), inset 0 3px 0 #6df0ff;'
                    + '-moz-box-shadow: 0 3px 0 rgba(13,22,25,.35),inset 0 3px 0 #6df0ff;'
                    + 'box-shadow: 0 3px 0 rgb(13 22 25 / 35%), inset 0 3px 0 #6df0ff;}'
                   );

            GM_addStyle('#season-arena .matchRatingNew {'
                    + 'display: flex;'
                    + 'align-items: center;'
                    + 'justify-content: space-between;}'
                   );

            $('.player-panel-buttons .btn_season_perform',opponents[index]).contents().filter(function() {return this.nodeType===3;}).remove();
            $('.player-panel-buttons .btn_season_perform',opponents[index]).find('span').remove();
            $('.player-panel-buttons .opponent_perform_button_container .green_button_L.btn_season_perform .energy_kiss_icn.kiss_icon_s').remove();

            if (doDisplay)
            {
                $('.player-panel-buttons .opponent_perform_button_container .green_button_L.btn_season_perform',opponents[index]).prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${nRounding(100*simu.win, 2, -1)}%</div>`);
            }

Replace this:

            //CSS

            GM_addStyle('.matchRatingNew {'
                        + 'text-align: center; '
                        + 'margin-right: 5px; '
                        + 'text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000; '
                        + 'line-height: 17px; '
                        + 'font-size: 14px;}'
                       );

this:

            //CSS

            GM_addStyle('.matchRatingNew {'
                        + 'text-align: center; '
                        + 'text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000; '
                        + 'line-height: 17px; '
                        + 'font-size: 14px;}'
                       );

Replace this:

        const pointText = `${nRounding(100*simu.win, 2, -1)}% (${nRounding(expectedValue, 1, -1)})`;
        $('div#leagues_right .leagues_team_block  .challenge .blue_button_L').prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${pointText}</div>`);

        if($('tr.lead_table_default td span.nickname span.OppoScore').length > 0) {
            $('tr.lead_table_default td span.nickname span.OppoScore').remove();
        }

this:

        const pointText = `${nRounding(100*simu.win, 2, -1)}% (${nRounding(expectedValue, 1, -1)})`;
        $('div#leagues_right .leagues_team_block  .challenge .blue_button_L').prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${pointText}</div>`);
        $('[hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn]').prepend(`<div class="matchRatingNew ${simu.scoreClass}"><img id="powerLevelScouter" src=${getHHScriptVars("powerCalcImages")[simu.scoreClass]}>${pointText}</div>`);
        $('div#leagues_right .leagues_team_block  .challenge .blue_button_L').contents().filter(function() {return this.nodeType===3;}).remove();
        $('[hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn]').contents().filter(function() {return this.nodeType===3;}).remove();
        $('div#leagues_right .leagues_team_block  .challenge .blue_button_L').find('span').remove();
        $('[hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn]').find('span').remove();
        $('.leagues_team_block .challenge button>[class*="_icn"], [hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn] .energy_challenge_icn').remove();

        if($('tr.lead_table_default td span.nickname span.OppoScore').length > 0) {
            $('tr.lead_table_default td span.nickname span.OppoScore').remove();
        }

Replace this:

        GM_addStyle('.leagues_team_block .challenge button {'
                    + 'width: 160px; '
                    + 'color: transparent;}}'
                   );

this:

        GM_addStyle('.leagues_team_block .challenge button, [hero-leagues-fixed-bar] [main-row] [challenge-mobile-btn] {'
                    + 'width: 160px; '
                    + 'padding: 6px 4px;}'
                   );

Remove:

        GM_addStyle('.leagues_team_block .challenge button>[class*="_icn"] {'
                    + 'opacity: 0;}}'
                   );

And replace this:

        GM_addStyle('@media only screen and (min-width: 1026px) {'
                    + '.matchRatingNew {'
                    + 'position: absolute;'
                    + 'width: auto;'
                    + 'left: 10px;'
                    + 'right: 10px;'
                    + 'display: flex;'
                    + 'flex-wrap: nowrap;'
                    + 'align-items: center;'
                    + 'justify-content: center;'
                    + 'text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000; '
                    + 'line-height: 17px; '
                    + 'font-size: 14px;}}'
                   );

        GM_addStyle('@media only screen and (max-width: 1025px) {'
                    + '.matchRatingNew {'
                    + 'text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000; '
                    + 'line-height: 17px; '
                    + 'font-size: 14px;}}'
                   );

this:

        GM_addStyle('@media only screen and (min-width: 1026px) {'
                    + '.matchRatingNew {'
                    + 'display: flex;'
                    + 'flex-wrap: nowrap;'
                    + 'align-items: center;'
                    + 'justify-content: center;'
                    + 'text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000; '
                    + 'line-height: 17px; '
                    + 'font-size: 14px;}}'
                   );

        GM_addStyle('@media only screen and (max-width: 1025px) {'
                    + '.matchRatingNew {'
                    + 'width: auto;'
                    + 'display: flex;'
                    + 'flex-wrap: nowrap;'
                    + 'align-items: center;'
                    + 'justify-content: center;'
                    + 'text-shadow: 1px 1px 0 #000, -1px 1px 0 #000, -1px -1px 0 #000, 1px -1px 0 #000; '
                    + 'line-height: 17px; '
                    + 'font-size: 14px;}}'
                   );

        GM_addStyle('[hero-leagues-fixed-bar] [second-row] .theme-container {'
                    + 'display: flex;'
                    + 'flex-wrap: wrap;'
                    + 'align-content: center;'
                    + 'justify-content: center;}'
                   );

        GM_addStyle('#leagues_middle .lead_table_view .theme-container {'
                    + 'margin-top: unset;}'
                   );

        GM_addStyle('#leagues_middle .theme-container .theme-element {'
                    + 'margin: 0 5%;'
                    + 'margin-left: unset;}'
                   );

Also slightly fixed the error of Kinkoid itself related to the not very correct display of squad elements when there are more than one of these elements. image image

Ideally, these lines should be moved outside the function so that they work globally to fix the Kinkoid error.

        GM_addStyle('[hero-leagues-fixed-bar] [second-row] .theme-container {'
                    + 'display: flex;'
                    + 'flex-wrap: wrap;'
                    + 'align-content: center;'
                    + 'justify-content: center;}'
                   );

        GM_addStyle('#leagues_middle .lead_table_view .theme-container {'
                    + 'margin-top: unset;}'
                   );

        GM_addStyle('#leagues_middle .theme-container .theme-element {'
                    + 'margin: 0 5%;'
                    + 'margin-left: unset;}'
                   );
UncleBob800 commented 1 year ago

Accidentally pressed the wrong button 😅

UncleBob800 commented 1 year ago

@tsokh @deuxge Made corrections from the message above in version 5.13.3(https://github.com/Roukys/HHauto/issues/719) HHAuto_5_13_3.txt

I also inserted those 3 blocks of CSS before the start of the function so that this little bug fix from Kinkoid would work globally even with PowerCalc turned off. Move these lines to a more appropriate place if you see fit. image

P.S. I don't know if anyone is using the mobile view of the League on PC, but I thought it would be fair to make corrections for this small number of players as well.