Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix display in Item Trader when large number of sockets are allocated #7234

Conversation

Peechey
Copy link
Contributor

@Peechey Peechey commented Jan 11, 2024

Fixes #7229

Description of the problem being solved:

Add a scrollBar to the Trader popup when the number of sockets reach a certain point. This allows the popup to show on even the smallest window PoB can be resized to. The rows are dynamically shown given they are within the scrollBar height, and in order to do this I had to change the anchoring from the row above it to a static sectionAnchor for all of them. That anchor is what is moved when the scrollBar offsets.

There are still some arbitrary numbers I used to fine-tune the UI so it would hide/show cleaner. The numbers in the hideShowFunc were trial and error, again whatever looked best personally.

I also fixed another odd bug I found where if you deallocate a socket after opening the Trader, and then opened it again, the previous socket controls still existed in the popup. I added a wipeTable in the close function for both the "Done" button and hitting escape so it's a clean slate every time you open the popup. The code related to this is the wipeTable in close() and adding "close" to the OpenPopup call at the bottom.

This PR also introduces a clean-ish way for any popup to use a scrollBar if needed, which wasn't easily possible before.

Link to a build that showcases this PR:

21 socket

eNqtHFt32jjzufsrODyTYMv3Pcl-h3BJ2CYNBRLafckRRoBTYVNbkJBf_40kA46LHTuwDylIcx_NaEYSe_G_1wWtrEkYeYF_WVXPlWqF-G4w8fzZZfVh2Dmzq__756-LHmbz--nVyqN85p-_vlyIzxVK1oReVh2jWmE4nBH2uCWlPQGpJfbZnAT-HX4Owutgcln9FvikWhljf-Kx7TeX4ij6hhfksjpwAblawZFL_ElzPx4DznGIXUbCW862sWLBXTCB2SmmEUwvsOcPAvcXYddhsFqCOtXK2iMvEqh717vvDxMyeX5SJtDpy0WP4g0JBwyzSgR_LqsNMA2ekRZewF-ghukKSCnnuo6Maj0X52oVRqwU4mBJyGQHq57rqpkF2gtJezolLvPWpBl6rDnHvpvgk4VXFvZuRZm3pB4JE3JlKnDzB3HDyYIdBgzTVm-QsI2JTMPOhw_Yx3KPPDa_omDKEtQ5Tnfme4yUROoFXhT4n9DjHUqmC1aUQrwVgu2TiIRrzLyUOJm0g8XY80tZ6Q77uBlEBXzAIXskhChmpRAGxA0g8MvyKIl5601JcchSesQIZaX5nB7tQVG40oQ_J1Afkl0xyEGwogUh2T73ICcTrEVe92BmZorq-nuWSM-htg6Y2Io-Ek_Ec_umt8-Puqqda4ZuGrqiqpmx1JtvIs_F9A6_eovVAlLnEP8ie4aqZuWsmNmc-ZAYMpEVLZNxxwvJZ_CaAZ18Cm-OgygL0db07PD2_BuoE3awDI8p-buivKqKRSaTaaZ57qfTHERMciMx4QAtb6d2_-bQXd8tFuAPfijyc3KDz2HAUfoQeLyUAOEL4-zZxAGccJGSz2xG_JjjJhFI51Ye1i0h7vwaHNXHjBTL2Dsoy0a55uXASfPm7koHzJtD_z1GCUtxxMOWUp3zXHYlLdX2STjbDOYeoXuNsl2fBN-K1sTLApjC1En0pMmRWYzhIYMUUq2kVUY4nBTbhMrKtMZRMtsjW883mIRP2srJTmQEilHAmJCilXcvDJ55bU_LoTXCRbAKC-yoXAUJnNQgezfc7lWym-mTycottjleUWjHiooPYlFaCqPBGHZ_tYLJjJRiUgpj12cJ1MFquYTEwb2fIqDm7rhQnXuJaudMQx9D38PiTUaxkrc1F2ewhy7MYFdwFOeSQimuCy8X0mzMIuCFWew8egfpYQGpXzTed0Gy91YyM2YHerJCDZYALNjo9YIXEH7Oj1CictBQWe3TfKYoIfHfNoXpvwMvxKDtT1YhD4fCPNIYh9gMvQXkzihqYYYrk7gkf8Shh32GxPFORHDozm_B-x1M6RiywWU1OSq-iSOhjkcZCVswxplywdIUVU6RM76oi8Mt_qm7WAYhq5BX_k8Ph2yzPW0SgGIE6ETM80XnDTmJ0mplMA9eGpM15zQMAhrtjqjwckn8yTsaw5CQCt5mGJcLIZTnXyoLHIHUG7liI65N4misOxFq-AEIAPWOZts1pOmWWlMVGzk1A2lWTTUty6jpjmrZMGAoCEAUZNU009T0mqbrtlZDqmPrNWSZhlnTdQQwpuZYZs0wkQO4pgG4pqJbqKbqyEGApQITZKoOwBiqo9R0QFYARoHPGlIcFSggG3jZmqbUDMdBQEGzkFYzEZAAeUzFAAoWMmoWfK4hRVEBULFNTl5XgIwG34C5A-MIeNk11VF1vQZiGGpNc2wT_sI_DuA6NigK7ZZR02xFByzbBoZAQQfxVWRqNdVCCtjFUFVQXTVBaQMmLKCv6SC-bZlgO6RbGhgGcWpAzATKtmKBWpbGTeiAVNDSaWAG2wFqBgL9NU0DAVXHgAEQEmyqmwrYCMwC2hpgEgDUQRMT-kLwieEogGSZYEDgCoYFI4AECDooreaAlhqyOEGD62qYBuhn2Lahg-E0bmHQmKOoIIRqG07NdjTudcAzbRssohvA29C4Ipqpgco2J6yqumNxdQAPCHFBFMNS-CrgIsDyAFfpsFBUExYMOMwEKZGlqwbnDgTAmQgk1kHMmmYY8Fd1LBWwQH9YRmAhDmNYXH0wfs20gJ8Bi84EU4KnwHoW9yayQAxdF4bjequKDksGOZoBxlJ0BN43EKxjXQMxwBTgOoQsYKdzeB7Z_DACh5vG-zDwPYg6BpGUOH9GWny0LOOEB9WXi4f-rfjwZc7YMvq7Xn95eTlfYjYPpuQVCq5zN1jUl4AE4XgW_fIoPeNk6w3472rWaEz7b-7ItH8P-331-89p4zpSRqPpfe86wG-P5Cpqft38PiPPY8P6sbFaM03tPlr_0eEP-tvtmuHSGT25m_Hv8Pd17zkE3129jub05nV-_zXCq_mi2TRu3bNRZ_l1c-sNF9ao_fp4Y_Wa6CG4Ne3Zy2J-q9y93r-o1ovzbc2-D85mnem_z2MbmZ3OjTV8alr_vrUHk4eHqNslw6b26oXf7zaQuV76DzPrbI1_Lu_8dbAMJp3usmH89_T6HAXad40a8_nIPDOCUdMYdldBw1o2-q0fbz-HP79N-347Mh87dzZ66niBc90cs_X9m-2b3_4LO7B4wjb5GipvT6PNf3prdEbYpouf3eXXq_GP1n047Pywmq235rPp_vbbTuD_bH93ns5Ub_17pINVLy-FY-pbz1zII_yoLr_xXT30IMPJLaHO06LI0Txv8g_fAkYiPscHt18uBtx1EeT-kF2TRXS1gW24w1uO1MFnnHg59IAwuackcS6rLFwRvldM8Yry8e8rTD2-DyAlOXwrb0L8IFzsDnWAFmwEvGSUJIebJc_UjdtbOdOgLKbG-W13BZn9Y4kq3mS_LUml-Mcmpq5Q-qLrL1es4otbkoUXuU_j1XTKbzyABQvFNU6702k3h93HdrytJlHEEn_yV4sxP-KX_24ZghREFPqVaDWO5MfL6qNHXoQgLcKwR2GrdwNK8TIiu31NCB1rQAEvh5qAuvF2FyWHae0Bsim1X0kI2_AMmkQ39EimXLv5D4SSDHkDycuQLGr8RiKbkGxQmrCJywY3w1Li3iebCr-IyVSHT-bgQgGDaSbnePYDSzC-bCHsvKnn8gou3-V8kUuoHLu4LhR_7ibH33F3lU1DXPFkEZCT2cjy2iYLO57Nsaq4Ksq0qpzNRm8RF2fqLiezkXdnJoEPZsqisoPKofQt8MUih6BpeJQ3QpmebVOyA8kmeM_mJIxr1SxKd5CjtiC5gRN64xXLDuMERI6txIFuhoX4XDaqPKvM0IHP5WSid4d3GQZNwmSTkidemYksD1U2xZn2i1vsHBfEp0kZ5pezOUbYHqll6B9P5wSJyL-NdeBN5DlLRrikwPISBhQWx5MRh0fHk0mfJh1PsQO17q9Mf8ez2egPzOOVyAEqsgIqRIQH1XEUeGwdR6GfLiT2uP38EkLkrxaZEjB0bgLbweT4l638FmxyLMe3BUkJsQ4Hwl61UrRkKj-oaWmKcoHG13p5a1iCfEAI9qKbnGqnGKXdAd8NwZS_0QjocQT_uL48Ss-ARdiftPgVxZGK8huO1RKIbSW7P1Su7l2apnpR3zYS4hiKl_bx4dmAhfy06S0IFj-hHzDVc01-i_scI-5toNBreWDuUCyTLS8O-IMfD5-rmrP_T_LsMmh24saLf972XauIyLcGI4KXgS-GEx1RDJoDFvdKcRdJA2ieAKc3hs6S6yIbHolVAX58Uh4N1PNRrghllcZ4E0WYVmR3WkEl8Lcs0zSM8jRQIRpiqjsBAuJwkE_y46MtrX_JC6EVOZJkVVSNwQtepuUwT2AP8wT2MAvaQxwdvjdIPFTCIlcBhHJaAq2EFjcEEvEfa-vYtfkpOx5yqnECp6onoKGXNMhnWB7S_xRBjgouSHEe_X5BxkMlFqSojUq57eASRkcuwDIhIEUu4-FrGqxJdMw6Oxx2xVOHqanp1CGGSnhKilDaTmrRdM-vIlL5Xg6VkPGwocusrsZiRQk7QRRpJ9gatIK2E9dh720XDx2y3aEFwu_WUgtEDhUkIO5iUhLIoaO9p5deckUTmLhEey90PFRQa3FzlCIgh0po3YcG4jN5W26ApbPQsZnWKO2O48sLdDSF42XQjzWcXjQR8svbVCKUQwVXpbjgTu3LcuhUpbNWyhaTTUWevZ1-AzROVTcW3aXE84NUopRDpYrwTJOgY1eZWZbA0WWMeZrFYBwtSJlVKZKueqyx1RPs8fqpSn_jNH4wj6yki6Y5_oQjVTCIkaPrhWNbAfU0dixau4m3PamMIofKZ2t0dLbOJfSZLv1zxjxVTJzIl5-O0aKxwB-mpYJBDhXc8vmLtPf4cqQgunjple69xFDR_oG_e0otYjlUtH_gD-vSFhBDZfbVA9F8sgqhcFPBX--legI59Jl4Pv54B51k0zpkkZPtXH8SuqjHZ-fyUW2IJ2QgDvlHhD_SjmJm_G3uixjhv_oVj6Bh0VM85uf9_DFzRbyYev8Kup6BrJwbe-TdfUzlxmMVeR2T-vVcLOhB4aT88t1T4E-92fZFsUvmAZ2QMDYL8cliE_-IevuSyUr-mOcQfPIX0VskIx_l_c8hEq-mUPJHIFnM0ljaBwLGP7oIKO1jP4loZSMudj_b5r9RJiGZDMRDpGDlswGh04TMH-i63UF28BYy7XyU3c3_FsfW7GyUyJt59H4qnrSDkOLt-PtnaBf1rdcv6un_D8H_AXzYGsM=

6 socket

eNqtG9t22rj2ufMVXjyTgK-YrmRmkZA0OZMLJ6TtmacuYQtQIyxqyyTM158tyQaHIsfG5KE10r5p37T3xpz99bagxgrHCWHRecs87bYMHAUsJNHsvPX1-frEb_315x9nI8Tnj9OLlFCx8-cfn87ks0HxCtPzluW3DI7iGebfclL2DyC1RBGfYxbdo58s_sLC89YDi3DLmKAoJDz_FFCUJA9ogc9b4wCQWwZKAhyFl9v1DHCOYhRwHN8JtoOUs3sWwi6PU9hdIBKNWfCC-ZeYpUs4TctYEfyqYG7vR49PzwWRSFQUCY706WxE0RrHY464kcA_560BaAbN8BAt4F-ghmgKpOzTrrv981qdUuSLNE74YRTGS4zDDZJ5als6yFGMr6ZTHHCywpcx4ZdzFAVbfl0dXl3Y-5RysqQExwWxXB3GzW_Eza6W_DPjiA5H4w2sc9q1C3_leIx_fIDvhM8vKKj0AC4C93YWEY4PRB4xkrCowfmKqHobpZRCgFaCfcIJjleIk_di6WmzxYREB2nvHkXokiUVbCQgRziG8Oe1EMY4YJAx6vKoiXlHprg6ZK1zZAh1pTnsHFfjqnC1CR8m0BNkx2qQY5bSipC8kKRsLdgQv23APG0qu422HMtorRiXN9hHwsmovroZbSPJ8U69btc3Hbdr-lo5RvN1QgJE79EbWaQLyLDP6AVvGTquqXeX2ZxHkB10uLajvV-uSYwPQLtkNDwEbY5YosOzfEsf2CS6gdJiA8vRhOLPRvfNxKYXuoGvw3ycTjWIk0nQD32_LAarKB-u8uCzAL6NgmqR_TWKZYIuVAClxp3iJwg4UXOA6FVRtkyyuK1yUyteMxxlDNeFusYqQ7rDOJh_ASM9IY6r5emt2c1eqW4FcCXdCsA9ui2h_x6jhqIEok5RfhlSTUVdRTiercdzgmlYDzoX7BItKyRUoecidiV9v2e3TxmVUGuq5DuKw2rXTl2ZVigpZnirPOQz8KKmLEdregzVKWCEeLds1tf97Keo-mk9tEG8YGlc0eIKuNoJ8utJ9TtPOEyDavfhBYXOrWonAmJRWgtjwDkKXoYsnOFaTGphbDowiTpOl0vIGcL6VQmIWxaqclKobk5s62PoR3DdShEs7uPqDLbQlRlsaozqXHZQqp9FFAm7bLwq4JVZbAx6D8lhAUlfNuT3LPw4wq6hEavUVUnAit3diL2C5HMxaEnqQUMxtb17tKLEOPp3XZn-O_BKDK6iMI1FKFTmsYuxj80zWUDeTJIh4sgIswr8G4oJirglp0AJRnEwvwPTXyNKJ5AJzlvFVfFpB9HMbXvWkZMu8XS7WLKYG_hN_DdCMV-ft6aIJlgByhWgk3ASya4a0g6lLWM8Z6-DcCVO8cwYTXIkAy2XOArf0XiOMTZQnkQCIYQ8o_hgLFDC4Y5SXpkIoQtzsttQqNGIGAggihLf6rddaCjMttM3e37bdftdr207jm-3-6bfNl3Tcdqm6fR7bc-yu_Dou_227fm-2bZ8G1Ysx_fctt31-mLF6blt14cNeLYss227bteG3R6sOL5vAUnP9HrAomvDrukBI9vvOj7s9jwhgN2z265jWr222RfMLdtv27bbBQjPBRGdntd2bLvnCNuI3hHF68H7E0YEFMpBSYU5o2VnI0SlAqGvT2dfn-7kw6c558vkc6fz-vp6ukR8zqb4Da7L04AtOktAAk2fJC-E0hNBtjOAv4vZYHB7uXywkpvBF74k8_h-SH8m7O7x5Z9vxH1-ubhOfy2u5uHJw-rRcvrkV98ZTjx_tMZXPXs1pH9fnswe5g9dq__3ejBMZ-nY9Gc3wa_vDlA_P5cCdnIJz9TMMumoTyI5xQSMqJy7Iywv3VC4hnh4YBwnYk8s5h_OxuIIiZGAZ37Bi-RiDQnlWtRNO3ObzLcE9BhzFR1FnHyYGuIpSqlY_2-KKBGu3i2u3qnBb8TixaYZBVLg6uLeUxSf10vhi4O7O7UzoDwjJtjlfq_8OxPIIOE28NSZxOMlooE889lttEy5Ecmh8IIkwY9JOp2KCS-w4LGcWl9dX19dPt9-u8ryQxFFWvpHlC4mYoKp_t9m8TGW1YqRpJNEPZ63vhH8KgUZYo4IhZwVMErRMsGbyJVCZyeggFdCTUJBS5vPg_fT2gLoKV294RgSzQwK3SAmWCvXZv8DoRRDUQSLfKqjJuasekKqyrqENKWKdI2m5FRbT0XMmbXHEZsluJCiEdVyznY_0AQXbgtRR6YkEFdRucmFkyuoEr0EAdxiwbrE3lmJqKchB9c6AmpTj6yGzzrsbLdEq3LwrdWq2tWjD3GAtGdXm3rkTd_HIlCTjsoGqoTSA4ukk0PQDAgV5ZzWslcUb0D0BB_5HMfZbayjdA85KgcpDZyYTFKuD-MCRImu5DBKoyGxp0dVsxbNGcReSSZ6N33QKLQIoyelunZtIitDVaW9Vn9Zo1Bigqwl1qhf7ZYoIR8LaM6fbZcEicy_gxUjoWoWNeGyA1aWMKCuaE5GdsDNyey2xM0pXkPJ96K1d7arR__KiahE9lBRBVAlIiKomlEQsdWMwtNuIbHFfSovIWT-GuIpBkWXJrANTIl9eRoN4ZLjJbatSEqKtT8QtkerRUul8r0nrU1ROWj2lUSZDyuQDwjBXXRTUu1Uo7QZU9xgRMU3zYw2I_jbVy-Nzsl4gqJwKMasDQ8qprTpEojlkj3uK1e3Jt2letbJGwnZaIvSPpsCjHks-ul_GVv8I6ZVpnnaMy21kLU6XtbeQK03JKDxWHpKzk4A_g8wnax5ueXQ4mTdlnjOm600wep70e8YLVkkl0VTqzoVBagFyrqjrG2kDNolwBhNoJUU0qsWR-EYwEtsqp64U45ygSk3BpN1kiBqqHbUsGrg5yx3abj1aViVaMit2xAIyIGH2BQzjJzWf_ArpoZaKbKqeozxK1ruyuEdQR_eEfRRh8YFg9jbJWDXIHCDIXP-5hpNXesgNeyziXsEm5hHoOHUVMghLPed_xgxalWMLzm4ex9g2VKNCJPFTC2z7XVhq6ED1gkBJXIdC3-hbIWTJn62P-y82hRqH9NsfMw6th0sUor5EXzYPkJetSvGgRyEv4-DbKlGHOzXnVPbXlWDV07g3wudLdUQ-gmK1UNSjsrdtT2raZJwa2uz-c1oNabQXAanqeKcY11Pdi1JwrWhpizHz5zusQoOs2K8ya_Z3sdbtlQj3kpUYjW1ce0qsvHF4B3HGdzGgtTxSpnyzKbKNo9wPR0tKN3j2MFrWII1L6iaFoHmcRRRtW6QX4jvpAS1VL9DtRqn21JCh_RnhynzWE59JFseHGQNXfFo95N1hExzDBrmsQ50tLT3O6GzTjZuk4NBOa-TrxqwaEpm-dtIAZ4zGuI4Y4EjvFhnv8rKXx7oFd__3Qdf_I1VjuRqURIyI_RxKl_eGnMk35LafU-hhFH-YkGOYn8gXB6HObxllcNnL3YySp9QVGTU-4DR-zdDC3jlaJvv1XJ4T4-w2Pw4TfzgCsc4HMv3EVga8TGm04Ii3XwenFn7rLP7C8f_A46aCuQ=

Before screenshot:

21 sockets
image

After screenshot:

21 sockets
image

tradeScroll

6 sockets, scrollBar shows starting at 7
image

…ar controls of TradeQuery every time you close, update anchoring to sectionAnchor instead of dynamically to each created row
@Peechey Peechey added the bug Something isn't working label Jan 11, 2024
@Peechey
Copy link
Contributor Author

Peechey commented Jan 11, 2024

Alternate solution for getting the scrollBar functionality:
Peechey:feature/popup_scrollbar_tradeQuery_alternate
Alternate vs dev: https://github.com/PathOfBuildingCommunity/PathOfBuilding/compare/dev...Peechey:PathOfBuilding:feature/popup_scrollbar_tradeQuery_alternate?expand=1

Removes the need to pass a function through Main:OpenPopup and PopupDialog, instead uses a Global index that PopupDialog is looking for in self.controls to run inside of Draw(). However it does require an invisible ButtonControl to attach the function and use the Click() function.

Here is the direct compare between my solutions: https://github.com/Peechey/PathOfBuilding/compare/feature/popup_scrollbar_tradeQuery...Peechey:PathOfBuilding:feature/popup_scrollbar_tradeQuery_alternate?expand=1

@Peechey Peechey changed the title Fix item display in Trader when large number of sockets are allocated Fix display in Item Trader when large number of sockets are allocated Jan 12, 2024
@LocalIdentity LocalIdentity merged commit 741d176 into PathOfBuildingCommunity:dev Jan 23, 2024
2 checks passed
@Peechey Peechey deleted the feature/popup_scrollbar_tradeQuery branch January 23, 2024 17:40
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Too many items causes "trade for these items" popup top buttons inaccessible
2 participants