GP2040-CE icon indicating copy to clipboard operation
GP2040-CE copied to clipboard

Recent updates to the custom LED theme page include enhanced color pi…

Open KeyOnTech opened this issue 10 months ago • 10 comments

Updates to the custom LED theme page include enhanced color picker placement options (top, bottom, left, or right) to ensure it never appears off-screen and remains accessible. Additionally, new button layouts for Haute42 (13 & 16 buttons) and DuelPad (16 buttons) have been added to the preview layout options dropdown list.

updates made to the custom led theme page users can now select where the color picker will appear top, bottom, left, or right preventing picker appearing off screen and unusable updates made to the preview layout options drop down list added Haute42 13 & 16 button layouts added DuelPad 16 button layout

KeyOnTech avatar Apr 19 '24 00:04 KeyOnTech

I have another push coming with some minor updates I tested on Safari Chrome MS Edge Brave Firefox Arc

  1. I made the size 450px on push
  • I did some tightening up and made it closer to the original 400px its now at 425px
  1. There is an issue on the Haute42 13 layout, if you shrink the screen to narrow the A2 and A1 buttons slightly overlap
  • I spaced the A1 button a little more to the right to fix it

new push on the way

KeyOnTech avatar Apr 19 '24 13:04 KeyOnTech

Hey @KeyOnTech, thanks for the PR! We appreciate the effort to make things easier while we're reworking the LED system.

I've taken a look through the code and tested it out, and here are my notes.

Rename layouts to match existing layouts in the Display Configuration page

  • Stickless 13 A to Stickless 13
  • Stickless 16 A to Stickless 16
  • Stickless 16 B to Stickless 16A (TBD, but let's go with this for now)

That last 16 button layout doesn't exist in the Display Configuration currently, so we may want to add that. Probably not a blocker for this PR, but something I'll need to follow up on.

Using the gradient feature on the new layouts doesn't quite work

image

This is because the matrices for the new layouts in Buttons.js are incorrect. These will need to be updated. For example, the Stickless 16 layout should be:

export const STICKLESS_16_LAYOUT = [
	[null, 'Left', null, null],
	['A1', 'Down', null, null],
	[null, 'Right', null, 'L3'],
	['A2', 'B3', 'B1', 'Up'],
	[null, 'B4', 'B2', 'R3'],
	[null, 'R1', 'R2', null],
	[null, 'L1', 'L2', null],
];

Which will produce: image

Consolidate button arrays into BUTTTON_LAYOUTS objects

I think the button arrays should be rolled into the BUTTON_LAYOUTS objects, into properites named mainButtons and auxButtons. Then this section can be removed, and instead bind directly against BUTTON_LAYOUTS[ledLayout].mainButtons here or BUTTON_LAYOUTS[ledLayout].auxButtons here.

Color Picker Placement

This feature works fine and I don't see a problem including it.

FeralAI avatar Apr 22 '24 04:04 FeralAI

Hey sorry for the delay on replying I'm just seeing your Github messages for updates I need to make to the the code. Still learning the PR Github features lol Some I already made others I need to review thanks I'll go through your notes and make some updates thanks

KeyOnTech avatar Apr 23 '24 17:04 KeyOnTech

gradient button selector not working fixed, moving to next issue

KeyOnTech avatar Apr 23 '24 19:04 KeyOnTech

Fixed: Rename layouts to match existing layouts in the Display Configuration page Fixed: Using the gradient feature on the new layouts doesn't quite work Fixed: Consolidate button arrays into BUTTTON_LAYOUTS objects Fixed: That last 16 button layout doesn't exist in the Display Configuration currently, so we may want to add that. Probably not a blocker for this PR, but something I'll need to follow up on.

KeyOnTech avatar Apr 23 '24 23:04 KeyOnTech

Everything noted has been fixed and updated

KeyOnTech avatar Apr 26 '24 07:04 KeyOnTech

Thanks @KeyOnTech! I'll try to get it reviewed this weekend.

FeralAI avatar Apr 26 '24 15:04 FeralAI

Reverted my changes to DisplayConfig.jsx due to a code conflict that has an API rewrite. Button layout and ButtonLayoutRight are now managed via an API, no longer an object in the page file, rendering my previous modifications unnecessary.

KeyOnTech avatar Apr 30 '24 03:04 KeyOnTech

I see a file conflict on the package-lock.json file I didnt make any updates to any of that I just did a npm i so hopefully this is a common minor thing besides that no other conflicts in my latest push thanks

KeyOnTech avatar May 03 '24 15:05 KeyOnTech

Hey @feralai wanted to check in on the updates I made to the color picker screen button layouts and color picker box. I got a comment today and they were experiencing what I was on different browsers I think my minor updates will help. wanted to check in and see if my web config updates were good to go and hopefully get approved to make the next build. I think it'll really help folks Thanks

IMG_3021

KeyOnTech avatar May 24 '24 02:05 KeyOnTech

I'll jump in on this one and put in my approval. I like the updates.

arntsonl avatar Jun 03 '24 14:06 arntsonl

Thank You !! I'll look around and see where else I can help on the web configurator.

KeyOnTech avatar Jun 03 '24 20:06 KeyOnTech