No probs.

As we're on the topic of improving FormUI, I've got a couple of my own
suggestions:

1.  How about table support?  I've taken a quick look and I suspect
this can be done in a similar way to the fieldset functionality, just
a bit more complex.

2.  How about some sort of uniform documented guidelines for plugin
options and templates to go with.  The guidelines and templates don't
need to be enforced, just encouraged for consistency.

My thinking here is purely aesthetics and "improving the user experience".

The default template used by FormUI is "formcontrol_*".  This has no
real sense of uniform structure and is very apparent when it comes to
creating plugins with lots of options of varying types.

"optionscontrols_" goes further to a uniform and consistent look, but
it needs more work (and more templates) and also needs supplementary
CSS to get things behaving properly and aligned correctly (at least on
my testing in FF3 on Solaris/OS X).

Here are some examples for you (from my yet to be released Slimbox 2 plugin):

Default template (formcontrol_*) :
http://skitch.com/lildude/b1gw6/formcontrol-no-tidy

Now the optionscontrol_* template without "tidy up CSS" [1]:
http://skitch.com/lildude/b1gib/optionscontrol-no-tidy-up

And now with "tidy up CSS":
http://skitch.com/lildude/b1gin/optionscontrol-with-tidy-up

As you can see, there's quite a difference in appearance.  The only
changes between each of these is the template assigned to each control
and the CSS for the last link above.

I actually use my own formcontrol template at the moment to keep
things perfectly aligned and consistent:
http://skitch.com/lildude/b1gid/slimbox-with-tidy-up but am more than
happy to drop this if something like table support or a more
consistent option is introduced.

Cheers,
Colin

[1] - The "tidy up CSS" looks as follows and is added to either
action_admin_header() or action_admin_footer() with a if() to ensure
it only applies to the one plugin's options:

            $output = '<style type="text/css">';
            $output .= 'form#'.strtolower( get_class( $this ) ).'
.formcontrol { clear: both; }';
            $output .= 'form#'.strtolower( get_class( $this ) ).'
span.pct15 select { width:105%; }';
            $output .= 'form#'.strtolower( get_class( $this ) ).'
span.pct15 { text-align:right; }';             // Not really needed as
this is my own preference
            $output .= 'form#'.strtolower( get_class( $this ) ).'
span.pct5 input { margin-left:25px; }';
            $output .= '.farbtastic { margin-left: -200px; margin-top:
25px; float: left; }';                        // Ignore this line as
it's only used in this plugin
            $output .= '</style>';


On Sat, May 30, 2009 at 2:41 AM, miklb <[email protected]> wrote:
>
> Colin,
>
> Thanks for pointing me in the right direction, we worked on
> implementing some of this into core this afternoon, as it seems as
> though it might be useful to others.  Both formcontrol textareas and
> formcontrol text will have optional titles for the labels and inputs.
>
> ~miklb
>
>
> On May 29, 7:06 am, Colin <[email protected]> wrote:
>> HI Mike
>>
>> You can, sort of, but you'll need to create your own form control to
>> actually use it as all the supplied formcontrols don't provide or use
>> the title option.
>>
>> A very simple example...
>>
>> 1.  Create your own formcontrol.
>>
>> Lets take the system/admin/formcontrols/formcontrol_text.php as an example.
>>
>> Copy it to a location used by your plugin.
>>
>> Modify it and add the title to the label, for example:
>>
>> ---
>> <div<?php echo ($class) ? ' class="' . $class . '"' : ''?><?php echo
>> ($id) ? ' id="' . $id . '"' : ''?>>
>>         <label title="<?php echo $title; ?>"><?php echo
>> $this->caption; ?></label>                             <!----  TITLE
>> ADDED HERE -->
>>         <input type="text" name="<?php echo $field; ?>" value="<?php
>> echo htmlspecialchars($value); ?>">
>>         <?php $control->errors_out('<li>%s</li>', '<ul
>> class="error">%s</ul>'); ?>
>> </div>
>> ---
>>
>> 2.  Add the formcontrol to your plugin configuration page and use it
>> and assign your title:
>>
>> --- filename.plugin/php ---
>> [...]
>>     public function action_plugin_ui( $plugin_id, $action )
>>     {
>>         $this->add_template( 'mikes_text', dirname( $this->get_file()
>> ) . '/lib/formcontrols/formcontrol_text.php' );  # [1]
>>
>>         if ( $plugin_id == $this->plugin_id() ) {
>>             switch ( $action ) {
>>                 case _t( 'Configure' ):
>>                 $ui = new FormUI( strtolower( get_class( $this ) ) );
>>                     $ui->append( 'text', 'mikestextbox', 'null:null',
>> _t( 'Mikes Textbox' ), 'mikes_text' );   # [2]
>>                     $ui->mikestextbox->title = "Your title";  #[3]
>>                    [...]
>> ---
>>
>> That's it.
>>
>> Your text box label should now have your title.
>>
>> WARNING: I've not tested this example. I've just adapted some of my
>> own code to illustrate the point.
>>
>> HTH
>> Colin
>>
>> [1] - This is the path to the location where you've saved your custom
>> formcontrol (usually in your plugin dir somewhere).
>> [2] - The 5th field must match the first field used in [1].  Change
>> the rest of the fields to suit your needs.
>> [3] - Setting your custom title.
>> [...] - The rest of the code for the plugin
>>
>> On Fri, May 29, 2009 at 11:15 AM, Michael Bishop <[email protected]> 
>> wrote:
>>
>> > is it possible to add a title to a label in formUI?
>>
>> > If so, could someone provide a code sample?
>>
>> > If not, how difficult would it be to add that as an option?
>>
>> > thanks in advance for any insight.
>>
>> > ~miklb
>>
>> --
>> Colin Seymour
>> Blog:http://www.colinseymour.co.uk
>> Tech Stuff:http://www.lildude.co.uk
> >
>



-- 
Colin Seymour
Blog: http://www.colinseymour.co.uk
Tech Stuff: http://www.lildude.co.uk

--~--~---------~--~----~------------~-------~--~----~
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to 
[email protected]
For more options, visit this group at http://groups.google.com/group/habari-dev
-~----------~----~----~----~------~----~------~--~---

Reply via email to