Weekly update – 23 August 2024

[ryan]

This week the most useful core update is likely the refactored column width slider in the template editor, located Setup > Templates > [your template] > Basics > Fields. You may or may not already know that clicking, holding and dragging the percent indicator on the right side of each field adjusts the column width. With the term “column width”, I mean the width of the field in the page editor, for when you want to have multiple fields in different columns on the same row. 

It’s a convenient and time saving shortcut. But it was also a little tricky to use, as it allowed anything between 10% and 100% in 1% increments, and it was a little finicky trying to get the percentages just right sometimes. It’s something that’s been bugging me for awhile, and @Pete messaged me on Slack this week and mentioned it. He suggested making it operate in 5% increments rather than 1% increments. He also suggested making a double click of the percent indicator open up the dedicated column width range slider that allows for more precise adjustments. I thought those were good suggestions, so I went ahead and implemented them this week. 

In addition to now using 5% increments, it also supports the commonly used 33%, 34% and 66% width values as well. But if you happen to already have some field that is using a less common width, like 27% or 72%, etc., then it reverts back to 1% increments for the same behavior as before. Of course, you can also use the 1% increments by double clicking the percent indicator to open the dedicated column width range slider. Thanks Pete for the suggestions, I think it all works better now. I’ll be applying the same changes to FormBuilder’s equivalent of this feature as well. 

This week I’ve also been working on the new CustomFields modules (FieldtypeCustom and InputfieldCustom). Most recently I’ve been working on adding support for multi-language fields, as well as adding more examples and tools to make it really easy to use and configure. I may have it ready as soon as next week or the following week.

The PageAutosave module is also getting a new version soon. I’ve been focused on the LivePreview feature of it and making a version of it that doesn’t depend on auto-save. The alternative LivePreview option (which we’ll just call “Preview”) will work anywhere because it has no field limitations. It simply updates the preview window whenever you save the page. While that’s not as fancy as live preview as-you-type, it’s still very helpful, while being reliable in any situation. It’s reliable and portable enough that I may end up putting the feature in the core, but will be testing it out in the next version of the PageAutosave module first. Have a great weekend! 

[BrendonKoz]

Thanks, Ryan, for implementing that change, and Pete for making the suggestion! It's obviously not a huge headache, and the slider interface itself is a quicker and easier way to modify things rather than going into each field individually, but I too kept looking for a simpler option, so this is a nice change. I'm sure I'll more often use the double-click method moving forward (esp. since 33/33/33 looks weird, so I set things to 33/34/33 for thirds).

With regard to the dedicated column width range slider, since there's no photo example of that in your post, does that also include a direct numeric input, or is it only a range slider? It may be nit-picky, but I think a numeric input might be even simpler/quicker. (Will you be using a <dialog> as the UI for that?)

Either way, this is such a small and simple thing that will just make me smile, so your effort here will definitely not be wasted!! Have an awesome weekend.

[wbmnfktr]

I became so used to use Template Field Widths that I almost always install it on larger projects.
Super fast editing of values, tabbing around and done.

[szabesz]

Great news, thank you @ryan!

36 minutes ago, ryan said:

I’ll be applying the same changes to FormBuilder’s equivalent of this feature as well.

For FormBuilder, it will be a nice improvement.

Even though it is a nice improvement for template fields and repeaters as well, I think I will still use @Robin S's visual aid: https://processwire.com/modules/template-field-widths/ Which is even faster to work with, as it provides a wireframe look, reducing the need to guess what the final layout will look like.

[Pete]

1 hour ago, wbmnfktr said:

I became so used to use Template Field Widths that I almost always install it on larger projects.
Super fast editing of values, tabbing around and done.

Ah so that's why this all felt so familiar! I remember using that one a while back on a site and then forgot all about it - thanks Robin for that one and to Ryan for improvements to the core field widths.

[wbmnfktr]

There is so much the community already has a solution for... we just have to remind ourselves about these solutions.
(to be fair... I regularly can't remember core functionalities as well)

Especially in cases like this, I would vote for something like a "merge this module into core"-principle of some kind, yet I want to see module authors thrive for and because of their efforts.

 

Similar to the Weekly update – 2 August 2024 announcement - where we saw similarities to already existing solutions:

 

[Pete]

9 hours ago, wbmnfktr said:

There is so much the community already has a solution for... we just have to remind ourselves about these solutions.
(to be fair... I regularly can't remember core functionalities as well)

I think you're right, and some things like Robin's module there are definitely things that could benefit from being in the core as it just makes sense - @ryan please do take a look at this one as it's incredibly useful to visually see how the fields will flow as well as in tabs etc and would be nice if it was in the core too as I don't think it would add much to it but add a lot of benefit to folks who launch sites regularly.

This is a bit of a tangent but talking about mental health is less taboo nowadays and I'm sure someone else here will relate - having recently been diagnosed with ADHD I tend to let myself off the hook a bit more now with my forgetfulness. I used to beat myself up about it but the fact is that something needs to be deeply engrained into my day-to-day work to remember it so modules that might help me with setup at the start of a project like TemplateFieldWidths are long forgotten by the end of it ?

It's also why I can write PHP and build big projects but cannot hang onto the terminology at all. Like people talk about closures and my brain can rarely remember what "operand" means some days but I can write it all... just the labels on my internal glossary/filing system aren't stuck on very well and keep falling off it feels like.

I spent until I was 43 amazed at how people can learn stuff and retain the knowledge so well. I'm very thankful to be pretty good with computers and good enough as a developer that I can do this for a living and live pretty well.

[cb2004]

Nicely said @Pete. I have struggled with mental health in the last 10 years and I actually find the ProcessWire forums with its community to be a relaxation tool for me. I love seeing people help each other every day and that makes me feel positive about the world. Sounds corny I know.

[Pete]

On 8/25/2024 at 6:19 AM, cb2004 said:

Nicely said @Pete. I have struggled with mental health in the last 10 years and I actually find the ProcessWire forums with its community to be a relaxation tool for me. I love seeing people help each other every day and that makes me feel positive about the world. Sounds corny I know.

Ah man I know what you mean - a long time ago (2012-14 maybe) I was here daily and I probably need to hang around here using the time I normally waste reading the news which is way less healthy for my brain. Or tapping away on other nonsense on my phone for hours.

[adrian]

Am I the only one seeing major bugs with the new template width functionality? See how the percent is going down, but then jumps back up again as I continue to drag to the left?

 

[ryan]

@adrian I'm not seeing that here, maybe it's browser specific - what browser are you seeing that issue in?

[adrian]

10 minutes ago, ryan said:

@adrian I'm not seeing that here, maybe it's browser specific - what browser are you seeing that issue in?

MacOS Brave and Chrome both have the issue for me.

[ryan]

Strange I'm using Chrome on Mac too, is anyone else able to duplicate that issue?

[monollonom]

After doing a test and seeing your gif could it be because you’re also slightly moving the mouse on the Y-axis?

Maybe the slider should stick to one axis once you passed a certain threshold?

[adrian]

2 minutes ago, monollonom said:

After doing a test and seeing your gif could it be because you’re also slightly moving the mouse on the Y-axis?

You're right, but how is it possible to move sideways (x-axis) without going slightly up or down (y-axis)? I don't really understand why y-axis movements should trigger any change at all.

[Christophe]

Hello,

Any updates on this project?:

Quote

The PageAutosave module is also getting a new version soon. I’ve been focused on the LivePreview feature of it and making a version of it that doesn’t depend on auto-save. The alternative LivePreview option (which we’ll just call “Preview”) will work anywhere because it has no field limitations. It simply updates the preview window whenever you save the page. While that’s not as fancy as live preview as-you-type, it’s still very helpful, while being reliable in any situation. It’s reliable and portable enough that I may end up putting the feature in the core, but will be testing it out in the next version of the PageAutosave module first.

Thanks in advance!
Have a great weekend!